Come modificare il template con Firebug

Spesso ricevo delle email con richieste d'aiuto per modifiche più o meno semplici da apportare al template, come ad esempio:

• modificare il font o il colore del titolo del post
• eliminare il bordo delle immagini
• modificare lo style delle voci della sidebar
• aggiungere un'immagine di sfondo al post
• "allargare" o "stringere" una colonna
• modificare la data del post

Con Firebug, un add-on per Firefox, è possibile capire facilmente quale parte del template modificare; vediamo come.

Innanzitutto dovete installare Firefox, poi l'add-on Firebug e aprire il vostro blog con questo browser.

In basso a destra nella finestra di Firefox vedrete un'icona con un insetto. Cliccando sull'icona, la finestra del browser viene visualizzata in questo modo:

cioè nella parte inferiore della finestra è possibile vedere ed analizzare l'html della pagina.

Per modificare un elemento (il titolo del post, la data, il link dei commenti, ecc) occorre cliccare sull'icona con la freccetta azzurra

e posizionarsi con il mouse sull'elemento da modificare. Man mano che vi muovete sulla pagina vedrete i singoli elementi rappresentati con un rettangolo dal bordo azzurro.
Ad esempio, se nel mio template voglio modificare il carattere della data, clicco sull'icona e mi posiziono sulla data:

In basso vedrò evidenziata la porzione di codice html relativa alla parte del template contenuta nel rettangolo azzurro:

Quindi se il codice html è <strong class="giorno">28</strong>, per qualsiasi modifica devo cercare la classe giorno nel css del template e modificare il font, il colore, la dimensione, l'immagine di sfondo, ecc.

Se invece voglio modificare il link dei commenti, procedo allo stesso modo. Clicco sull'icona e mi posiziono con il mouse sulla parte che intendo modificare:

Visualizzo così questo html:

In questo caso, qualunque siano le modifiche che voglio apportare devo trovare nel template la classe comment-link.

Newsletter by follow.it

Il primo incontro... non si scorda mai!

Dopo mesi e mesi di email, commenti sui nostri blog, chat e telefonate su skype, lo scorso weekend ho conosciuto di persona Ale e Solidea.

Difficile descrivere l'emozione che ho provato nell'aspettare l'arrivo del treno di Ale e poi insieme a lei l'arrivo di Solidea.

Il nome del loro blog è "a spasso con Solidea e Ale"... e per tre giorni sono stata letteralmente a spasso con loro per le vie della capitale... una bellissima esperienza che spero presto ripeteremo.

Durante le nostre passeggiate per Roma, tra una chiacchierata e l'altra a proposito di blog e html, ci siamo conosciute meglio e grazie a loro ho conosciuto meglio anche Roma, città in cui vivo per lavoro da tre anni ma che conosco veramente poco come turista.
Lo ammetto pubblicamente, non sono stata una buona cicerona, ma io confidavo nella presenza di Jajo.

Di foto le due fotografe ne hanno scattate veramente tante...
di seguito ne pubblico solo alcune.

Noi tre a S. Pietro

Purtroppo al nostro incontro non ha potuto partecipare Solema per impegni personali... ma come mi aveva scritto in un commento qualche post fa, mi ha mandato con Solidea un pensierino per ringraziarmi...
Pensierino secondo lei, per me è un pensierone, eccolo:

Grazie Solema, è tutto squisito!
E poi la biscottiera è bellissima e molto utile.

Scrivere post personali è molto più difficile per me che scrivere post tecnici, ma vi posso assicurare che è stata una bellissima esperienza.
Beh che dire??? Ragazze, a quando il prossimo incontro???

Mi piacerebbe conoscere anche Solema e Daniela & Diocleziano, che ho sentito in questi giorni al telefono, Jajo e tutti voi lettori che seguite il mio blog.
Si accettano proposte e suggerimenti per il prossimo incontro!

Newsletter by follow.it

Come risolvere il problema della data "undefined" in alcuni template

Spesso ricevo delle email con richieste d'aiuto per eliminare la data "undefined" in alcuni template. L'ultima, in ordine di tempo, mi è arrivata ieri sera da Edo in cui mi scriveva:

sto modificando il codice di un template nuovo per il mio blog; il problema è che dove dovrebbe comparire la data e il mese del post, esce la scritta "undefined".

Il problema si risolve facilmente cambiando alcune impostazioni.

Vediamo prima però perché si verifica questo problema. In alcuni template, la data e l'ora di pubblicazione del post sono visualizzati in un formato diverso da quello di default di Blogger.
Nel mio template ad esempio la data di pubblicazione è visualizzata in alto a sinistra nel post nell'icona a forma di calendario. Ciò è reso possibile da una funzione javascript che converte la data di Blogger nel formato che visualizzate.

Ecco alcuni esempi di trasformazione:

Ciascun template ha una funzione javascript che si occupa della trasformazione che si aspetta un formato di data; il formato però varia da template a template.
Quindi se al posto della data compare la scritta "undefined" significa che il formato che avete impostato non è quello che la funzione si aspetta. Occorre quindi andare in Blogger - Impostazioni - Formattazione e selezionare dal menu a tendina di Formato intestazione data o Formato ora un formato diverso da quello selezionato; salvando le impostazioni se la scritta "undefined" non scompare significa che il formato non è quello che la funzione si aspetta.





Chi ha un po' di dimestichezza con il codice javascript, può capire il formato che deve selezionare dando un'occhiata alla funzione che fa la trasformazione.
Chi invece di javascript non ci capisce molto, e in alcuni casi non ci si sforza nemmeno di capirlo, allora il consiglio che vi posso dare e di provare tutti i formati disponibili fino a far scomparire la scritta "undefined"... se dopo tutti i tentativi la scritta compare ancora, allora contattatemi.

Newsletter by follow.it

Menu "orizzontale" per il blog

Durante le ferie ho ricevuto un'email da Francesca in cui mi chiedeva:

vorrei mettere un menu orizzontale sotto il titolo del blog con i link: home, chi sono, ricette, eventi, ...
magari che apra una tendina per esempio nelle ricette dia l'opzione di scegliere primi, secondi, dolci, ...

Tempo fa Francesca mi aveva chiesto di realizzarle uno script per consentire ai suoi lettori la stampa delle sue ricette; per questo avevo creato un blog di prova sul quale ho testato lo script. Sempre sullo stesso blog ora trovate il menu in funzione!

Vediamo passo passo come realizzarlo.

Newsletter by follow.it

Finite le ferie... si torna al lavoro

Le ferie sono finite e si ritorna al lavoro.

Anche l'attività sul blog riprenderà nei prossimi giorni con nuovi post.
In questo mio periodo di assenza, ho ricevuto diverse email con richieste più o meno complesse. Alcuni di voi hanno già ricevuto una risposta, altri l'avranno a giorni con la pubblicazione dei nuovi post.

Risponderò inoltre a tutti i vostri commenti, visiterò i blog dei nuovi lettori che si sono aggiunti in questo periodo e leggerò i vostri nuovi post.

Newsletter by follow.it

Finalmente in ferie :)

Da domani sarò finalmente in ferie e anche l'attività sul blog si ferma un po'!!! Nelle prossime settimane sarò online molto raramente, continuate comunque a lasciare commenti o ad inviarmi email, vi risponderò appena possibile.

Anche l'header del mio blog da oggi avrà un look più estivo: l'ho realizzata con una foto scattata da Francesco l'anno scorso mentre eravamo in ferie nella nostra amata Calabria.

Ringrazio Amsis per tutte le bellissime foto che mi ha inviato e che ho utilizzato per le headers del mio blog per mesi e mesi e che abbelliranno nuovamente il mio blog al mio rientro dalle ferie.

Credo di aver risposto a tutti coloro che gentilmente hanno chiesto il mio aiuto, purtroppo non sempre riesco o posso dare una risposta immediata ed esauriente; invito pertanto chi non ha ricevuto risposta, o per una mia svista o perché la mail è andata persa tra le tante richieste pervenute, a inviarmi nuovamente un'email per promemoria.

Concludo augurandovi buone ferie e a chi le ha già fatte buon lavoro!

E come scrivo sempre su messenger prima di partire...

Il più bel viaggio è quello che mi riporta a CASA!

Newsletter by follow.it