Inserire la pubblicita' su Blogger modificando il modello

Ho già trattato di come registrarsi a Google Adsense e di come inserire gli annunci nella Homepage di un blog su Blogger, oggi parlerò di come inserire il codice direttamente nel modello per avere una unità pubblicitaria subito sotto il titolo del post e una alla fine dell'articolo e questo in tutti i post anche in quelli eventualmente già pubblicati.
Occorre accedere nel nostro account Adsense e acquisire gli annunci. Si clicca su Impostazioni Adsense > Adsense per i contenuti > Unità pubblicitarie

Si lascia l'impostazione di default "Annunci di testo e annunci illustrati" quindi si clicca su Continua. Nella finestra successiva si scelgono i formati e i colori. I primi devono essere adatti al layout del blog ma è consigliabile utilizzare sempre quelli più grandi come per esempio il rettangolo 336x280 pixel. Per i colori è opportuno adattarli a quelli del blog. Ricordo che ciascun colore è determinato da un codice esadecimale che lo individua in modo univoco.

Si possono scegliere i colori del bordo, del titolo dello sfondo, del testo e dell'URL. In genere il bordo è meglio toglierlo quindi mettere il colore #FFFFFF e per lo sfondo è opportuno sceglierlo uguale a quello del blog.

Più in basso si possono selezionare i Tipi di Carattere (Predefinito, Arial, Times, Verdana) e la loro dimensione (è opportuno scegliere "Grande"). Si clicca nuovamente su Continua per creare un canale per monitorare i rendimenti di un singolo annuncio.

Mettiamo il caso che il nostro blog si chiami "Reality" ecco che come "criteri di monitoraggio" possiamo scegliere "reality alto" per l'annuncio sotto il titolo e "reality basso" per quello alla fine del post. Questo si fa andando su Aggiungi nuovo canale

Dopo che si è fatto si clicca nuovamente su Continua quindi su Invia e acquisisci il codice

Ripetere questa operazione due volte per il codice da inserire sotto il titolo e per quello da mettere alla fine del post. Volendo possiamo scegliere anche colori e formati diversi come variare tutte le altre impostazioni.

Il codice ottenuto non potrà essere incollato così com'è nel modello di Blogger in quanto detto modello utilizza il linguaggio XML invece di quello HTML. Dobbiamo quindi effettuare una conversione online attraverso uno dei tanti strumenti messi a disposizione dalla rete.

Personalmente uso lo strumento Blogcrowds. Si incolla il codice ottenuto da Adsense nel modulo e si clicca su Parse

Il codice in formato XML ottenuto va selezionato e copiato in un file di testo, questo va fatto per entrambi gli annunci.
E' giunto quindi il momento di porre mano alla modifica del modello andando su Design > Modifica HTML. Per ogni evenienza è sempre auspicabile cliccare su Salva modello completo per un eventuale backup. Espandere i modelli widget e cercare la seguente riga

<div class='post-body entry-content'>

Se non è presente cercare una analoga che abbia la stessa parte iniziale. Alternativamente possiamo cercare la riga

<data:post.body/> oppure <p><data:post.body/></p>


Il codice di Adsense va incollato immediatamente sopra a una di queste righe secondo questa sintassi

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p>
Codice AdSense (parte alta)convertito in XML
</p>
</b:if>

dove al posto di Codice Adsense convertito in XML va inserito il codice ricopiato dallo strumento online Parse. Questo codice è quello relativo all'annuncio che si visualizzerà immediatamente sotto al titolo del post.
Per inserire invece il codice da visualizzare alla fine dell'articolo bisogna cercare la riga

<data:post.body/> oppure <p><data:post.body/></p>

e, immediatamente sotto, incollare il codice

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p>
Codice AdSense (parte bassa)convertito in XML
</p>
</b:if>

Non resta che andare in basso e cliccare su Salva Modello. Se è la prima volta che inserite la pubblicità potrebbe volerci qualche minuto prima che sia visualizzata altrimenti sarà immediata e sarà visibile sia prima dell'articolo che alla fine.

In conclusione:

1. I due tag <p> e </p> evidenziati di verde possono anche essere tolti. Il loro inserimento serve unicamente affinché la pubblicità non vada ad interferire con il contenuto del post
2. Il procedimento è lo stesso per inserire anche gli Insiemi di link che sono una forma di pubblicità molto performante. Sono disponibili in versione orizzontale o verticale e in vari formati.
3. Nel caso abbiate nel blog il cosiddetto read more per gli articoli sintetici, inserite il codice per gli annunci alla fine del post dopo il blocco relativo a questa personalizzazione e che dovrebbe essere simile a questo
   
   <b:if cond='data:post.hasJumpLink'>
   <div class='jump-link'>
   <a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
   </div>
   </b:if >
   <b:if cond='data:post.hasJumpLink'> <div class='jump-link'> <a expr:href='data:post.url + "#more"'><data:post.jumpText/></a> </div> </b:if >