Come inserire un elemento solo nei post con una data etichetta.

Attraverso i tag condizionali si possono mostrare widget o oggetti solo in determinate pagine o anche in un singolo post. Non mi risulta sia stata tuttora risolta la questione di come mostrare un widget inserito dal Layout negli articoli che abbiano una determinata etichetta.

Si può però inserire alla fine di tutti gli articoli con una data etichetta un oggetto HTML che si visualizzi soltanto in quei post. Questo può essere utile per quei blog che abbiano creato delle etichette con significati particolari. In un sito che si occupa di recensioni di abbigliamento, sotto ai post che abbiano l'etichetta di una particolare marca si può inserire un banner anche pubblicitario che inviti a visitare il relativo showroom. Si potrebbero naturalmente fare una infinità di esempi anche più calzanti di questo.

Come aggiungere due colonne sopra o sotto l'area del post su Blogger

Ho già illustrato come dividere l'header in due parti e come dividere in tre o quattro parti l'area sotto l'header. In questo articolo vediamo come sia possibile aggiungere due colonne sopra l'area del post e due colonne sotto l'area del post. Dico subito che le colonne possono anche essere tre e che si possono aggiungere solo quelle sopra, solo quelle sotto o entrambe. Si può inoltre aggiungere per esempio tre colonne sotto l'area del post e due colonne sopra.

Per effettuare questa personalizzazione basta inserire degli elementi Aggiungi un gadget in quella zona del layout. Successivamente sarà facile inserire dei widget che possono essere del tipo HTML/Javascript oppure di altro genere. L'obiettivo è quello di creare un layout di questo tipo

Come visualizzare i nomi dei widget in Design > Elementi pagina ma nasconderli nel blog.

Quando si installa un widget su Blogger si va su Design > Aggiungi un gadget e si sceglie quale tipo di widget inserire. Abbiamo la possibilità di digitare o meno anche il suo titolo. Qualche tempo fa questa opzione fu tolta ma subito riamessa dopo le numerosissime proteste. Erano comunque già state trovate le giuste contromisure. Quando non si inserisce il titolo in un widget del tipo HTML/Javascript, in Design > Elementi pagina si visualizza appunto la stessa scritta per tutti i gadget. Questo può provocare dei problemi di individuazione specialmente se abbiamo dei blog con molti gadget

 

Come posizionare e stabilire l'ordine di sovrapposizione tra oggetti HTML.

La posizione di un elemento all'interno di una pagina web è determinata dalla proprietà position e può essere applicata generalmente a tutti gli oggetti. I valori che può assumere position sono:

1) static - E' la posizione normale ed è quella di default che assume un elemento senza la proprietà position

2) absolute - In questo caso l'elemento viene posizionato in funzione del suo contenitore più prossimo che abbia un valore diverso da static. Se questo elemento non c'è, allora la posizione coincide con l'area del browser. Si usano gli attributi top, bottom, left e right per fissare le distanze nelle quattro direzioni.

3) fixed - La differenza con absolute sta nel fatto che in questo caso il contenitore è sempre la finestra principale del browser. Un'altra particolarità di questo valore è che l'oggetto non scorre insieme alla pagina
4) relative - L'elemento viene posizionato in funzione del suo contenitore. Gli spostamenti ottenuti tramite left, right, top e bottom sono non in funzione della pagina web ma in relazione al contenitore dell'elemento.

Mostrare da quanto tempo è online un blog su Blogger.

Conoscere esattamente l'età o quanti giorni di vita ha un blog e mostrarlo ai visitatori può essere una interessante curiosità. Si tratta di copiare questo codice misto HTML e Javascript

<span style="color:#003366; font-weight: normal;">Questo blog è nato da </span><span style="color:#940F04; font-weight: bold;"><script>    
    var mesearray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
    function contatore(yr,m,d){
    var today=new Date()
    var giorno=today.getYear()
    if (giorno < 1000)
    giorno+=1900
    var meseg=today.getMonth()
    var giornoday=today.getDate()
    var todaystring=mesearray[meseg]+" "+giornoday+", "+giorno
    var paststring=mesearray[m-1]+" "+d+", "+yr
    var durata=(Math.round((Date.parse(todaystring)-Date.parse(paststring))/(24*60*60*1000))*1)
    durata+=" giorni."
    document.write("" +durata+"")
    }
    //nascita blog: giorno, mese, anno
   contatore(28,01,2008)
    </script></span>

che si può incollare in Design > Aggiungi un gadget > HTML/javascript > Sezioni del sito. Dopo aver salvato si può posizionare nella sidebar. Si possono personalizzare i colori della prima parte della scritta (normale) e quelli della seconda parte (in grassetto). L'unico dato fondamentale da inserire è la data di nascita del blog che deve essere sostituita nella riga contatore(28,01,2008). L'aspetto della scritta sarà

Come visualizzare Aggiungi un gadget in nuove posizioni del modello.

Se si ha un blog su Blogger e si va su Design > Elementi pagina si vedono uno o più riquadri che indicano la possibilità di aggiungere un widget. In genere non è particolarmente importante avere molti di questi riquadri perché il gadget potrà essere spostato con il mouse in qualunque posizione si desideri. Questo vale per modelli con pochi widget e che siano quelli ufficiali di Blogger.

Non sempre quindi è così e ci sono template che non consentono per esempio di spostare un gadget sopra all'intestazione del blog. Un tale widget potrebbe essere utile per installare il banner orizzontale di Liquida o di Virgilio. Vediamo come risolvere questo piccolo problema. Ecco come è l'aspetto degli elementi pagina per questo blog

Menu verticale grigio da inserire in una sidebar di Blogger.

Avere un menù molto ricco risponde alle esigenze di migliorare la navigabilità del sito ma anche a precisi vantaggi in ambito SEO. E' dimostrato che linkare i propri articoli in homepage ne migliora la SERP nei motori di ricerca. Con queste premesse è quindi auspicabile cercare di avere in Home più collegamenti possibili alle pagine interne del sito o comunque a quelle che riteniamo più rilevanti.

Un buon menù orizzontale potrebbe non essere essere sufficiente a contenere tutte le voci che ci interessano. In alcuni modelli può risultare utile aggiungere anche un menù verticale da inserire in una sidebar per tutte quelle voci che non siamo riusciti a inserire in quello principale. Quello che vado a presentarvi è di colore grigio ma, se avete anche solo una modesta pratica di programmi di grafica, può essere modificato in qualsiasi colore. Passo subito a mostrarne l'aspetto

 

Impostazioni per configurare il post su Blogger.

Spesso ricevo delle richieste su personalizzazioni per i blog su Blogger che sono già ampiamente presenti e per le quali non occorre inserire codice o modificarlo. Mi riferisco per esempio al Read More, che orami da molti mesi è disponibile, così come alla stecca di biliardo per i feed, alle statistiche e alla versione per dispositivi mobili.

Una pagina delle configurazioni ancora poco conosciuta è quella a cui si accede andando su Design > Elementi pagina > Post su blog > Modifica

Ci sono moltissime personalizzazioni che erroneamente si ritiene di dover fare modificando il codice del template. Non a caso l'elemento pagina si chiama Configura post sul blog

In Blogger è adesso obbligatorio inserire il titolo nei widget HTML/Javascript.

Dopo l'introduzione del Designer Modelli su Blogger sono cambiate alcune cose, molte in positivo, ma una decisamente in negativo. Quando volevamo inserire un banner, una foto, un antipixel o semplicemente del testo andavamo su Layout (Design) > Aggiungi un gadget > HTML/Javascript, incollavamo il codice relativo e salvavamo.
Non era assolutamente necessario digitare il Titolo del widget che sarebbe stato visualizzato su Layout > Elementi pagina come HTML/JavaScript

pElement per avere la tavola periodica di Mendeleev nel desktop.

Gli studenti di Chimica sanno certamente cosa sia la Tavola periodica di Mendeleev e la avranno di sicuro a portata di mano in qualche pagina del loro libro di testo. Per coloro che sono abituati a studiare al computer vi propongo un interessante tool gratuito messo a punto dalla Crystal Mountain Software.

pElement è un software per Windows (XP, Vista o 2000) che, oltre a mostrare la classica tavola degli elementi, dà molte altre informazioni. La sua dimensione è di 1,7MB e non presenta difficoltà di installazione. All'apertura del programma si vede l'interfaccia classica a cui siamo abituati fin dai primi anni delle superiori

La tavola periodica degli elementi di Mendeleev in versione web per gli studenti di Chimica.

La tavola periodica degli elementi che si deve all’intuizione del chimico russo Mendeleev è stata presentata nel 1869 e presentava parecchi spazi vuoti che sarebbero stati riempiti nel secolo successivo. Adesso siamo anche riusciti a produrre elementi non presenti in natura. Per la cronaca siamo già al numero 118 con l’Ununoctio scoperto da fisici russi in collaborazione con i laboratori americani di Livermore nel 2002.

Webelements presenta la classica tabella tabella in forma interattiva. Basta cliccare su un elemento per avere tutte le informazioni riguardo a numero atomico, peso atomico, nome del gruppo cui appartiene, colore, stato a temperatura ambiente, cenni storici e molto altro

Nella parte alta sono presenti dei bottoni che rimandano a dati specifici che riguardano tra l’altro i dati orbitali, la struttura cristallina, gli ioni, gli isotopi, l’entalpia, ecc.

Un sito veramente ben fatto che consiglio vivamente a tutti gli studenti delle superiori ma anche a livello universitario per quanto riguarda la chimica inorganica.

Ptable è un sito simile al precedente con alcune differenze in positivo ed in negativo

• Da meno notizie riguardo a ciascun elemento
• Però ha un’interfaccia in italiano
• E ha dei collegamenti con Wikipedia per approfondire le notizie su ogni singolo elemento