Come installare il widget degli articoli correlati con miniature in Blogger.

Sviluppato da Parsifal 32 questo widget può essere particolarmente personalizzato e mostra delle miniature di articoli che sono un mix tra post con la stessa etichetta e articoli casuali.

Le miniature sono ricavate dalle immagini presenti nei post correlati. Quando non ci sono immagini ne viene vista una di defaul.

Andate su Layout > Modifica HTML e scaricate il modello completo.

Ancora una volta: fate un bel backup del vostro modello prima di modificarlo.

Espandete i modelli widget (spuntare la casella) e cercate la riga:

</head>

e, immediatamente sopra, incollate il seguente codice:

<!-- Articoli Simili Con Miniature-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: #191919; /* Colore del Titolo */
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;Trebuchet MS&#8221;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#FDBCB7;
}
</style>
<script src='https://sites.google.com/site/scriptperilblog/javascript-2/miniaturepost2.js' type='text/javascript'/>
</b:if>
<!-- Articoli simili con Miniature-->
Le personalizzazioni riguardano il colore del titolo delle miniature e il colore dello sfondo quando vengono puntate con il mouse. Se volete cambiare l'immagine che appare quando nel post non ce ne sono dovete semplicemente scaricare questo file javascript e sostituire l'URL dell'immagine a inizio post con quello di un'altra immagine che avete precedentemente caricato sul web mediante Skydrive o servizio analogo.
Adesso cercate questa riga

<div class='post-footer-line post-footer-line-1'>

e, immediatamente dopo, incollate il codice:

<!-- Articoli Simili con Miniature -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.ideepercomputeredinternet.com/2010/01/il-widget-degli-articoli-correlati-con.html' style='display:none;'>Widget degli articoli correlati con miniature per Blogger</a><a href='http://www.ideepercomputeredinternet.com/' style='display:none;'>Idee per Computer ed Internet</a>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=6; /* Numero di Articoli Simili */
var relatedpoststitle=&quot;Ti potrebbero anche interessare:&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Articoli Simili con Miniature -->

Le personalizzazioni  (in rosso)riguardano il massimo numero di risultati per ciascuna etichetta (il primo 6 che lascerei comunque invariato) e il numero di articoli simili da visualizzare tramite miniatura (il secondo 6 che dipende dalla larghezza del template). In ogni modo aumentare il numero non dovrebbe diventare per forza un problema, dipende, come al solito, del template che usate.
 
Ricerca personalizzata


Se ti è piaciuto l'articolo , iscriviti al feed cliccando sull'immagine sottostante per tenerti sempre aggiornato sui nuovi contenuti del blog:


Commenti

  1. Ciao, lo mette sotto ad ogni articolo pubblicato? quindi se in home ho 3 articoli per 3 volte si vedranno le miniature?

    RispondiElimina

Posta un commento

nome-foto