Pubblicato il 18/09/16e aggiornato il

Come mostrare nello snippet la meta descrizione o l'incipit nella condivisione di un post di Blogger.

Come scegliere se mostrare la metadescrizione o l'incipit del post nello snippet della condivisione dello stesso su social quali Facebook o Google+ inserendo o meno i microdati schema.org.
Qualche giorno fa ho letto un commento in cui mi si chiedeva come mostrare l'incipit dell'articolo al posto della descrizione nello snippet che si visualizza sotto il titolo quando si condivide in social come Facebook o Google+. Di primo acchito ho risposto che poteva condividere il post senza  aggiungere la Descrizione della Ricerca nella colonna di destra delle Impostazioni post nell'Editor di Blogger. Lo avrebbe fatto solo successivamente alla condivisione.

Il commentatore nella sua risposta mi ha fatto presente che avrebbe voluto che l'incipit fosse sempre visibile al posto della meta descrizione anche nelle eventuali condivisioni future. Mi rimane il dubbio su a cosa possa servire questa personalizzazione ma casualmente la soluzione me la sono trovata a portata di mano senza volerlo.

Mi sono infatti accorto che dopo aver implementato anche in questo blog la metadescrizione da visualizzare prima del contenuto del post, la condivisione su Google Plus mostrava nello snippet l'incipit e non la meta descrizione. Ho subito capito da cosa dipendesse il problema. Erano i cosiddetti microdati Blogposting Schema.org che non essendo stati aggiunti nel codice implementato nel modello non venivano rilevati in fase di condivisione. 

Ho quindi modificato il post in oggetto e anche il mio template inserendo il tag itemprop='description' che è appunto il tag che individua la metadescrizione. Ricapitolando per aggiungere la metadescrizione sotto il titolo e  sopra il contenuto si va su Modello -> Modifica HTML quindi subito sopra a ]]></b:skin> si incolla il codice seguente

/* Snippet Descrizione */.ipcei-snippet {
clear: both;
float: none;
margin: 10px;
padding: 5px;
text-align:center;
border: dotted 2px #F95B5B;
background: #e1fbf8;
border-radius:8px;
}
span.ipcei-summary {
color: #393939;
font: italic 14px Georgia;
}

Successivamente si cercano le righe <b:includable id='post' var='post'> per la versione desktop e, opzionalmente, la riga <b:includable id='mobile-post' var='post'> per la versione mobile. Si scorre verso il basso fino a trovare la riga <data:post.body/> e, subito sopra, si incolla quest'altro codice

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.metaDescription'>
<div class='ipcei-snippet'>
<span class='ipcei-summary' itemprop='description'>
<data:blog.metaDescription/>
</span></div>
</b:if>
</b:if>






Si salva il modello. I parametri in rosso possono essere modificati adattando i codici dei colori e lo stile del bordo. Con questo codice nello snippet della condivisione sarà mostrata la metadescrizione

condivisione-google-plus-snippet

Se invece preferite avere l'incipit nello snippet allora basterà togliere itemprop='description' dal codice precedente. Dal punto di vista SEO non penso che l'assenza del tag itemprop='description' possa avere delle sensibili conseguenze però non lo si può escludere.




Nessun commento :

Posta un commento

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.