Afficher billets similaires

mercredi 13 octobre 2010

Comment ajouter sur blogger la liste des billets similaires en bas de post.



Widget bien pratique qui permet au visiteur de rester plus longtemps sur votre blog en ayant la liste des billets par libellé qui l'intéresse sous les yeux.

Nota: il faut classer les billets par libellé, donc activez ce gadget.

Cette option n'existant pas chez blogger il va falloir modifier le code HTML du template.
  • Première étape: aller dans présentation, modifier le code HTML et cocher "Développer des modèles de gadgets"
Chercher la balise </head> et juste avant y placer ce code.
<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url(&quot;http://lh3.ggpht.com/_cNpXRtRph18/S76dASm3WGI/AAAAAAAAEJg/AVmw4HhRdsk/rss.png&quot;) no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://www.yourjavascript.com/1741101218/JS similaire.js
' type='text/javascript'/>
Ensuite toujours dans le code HTML du template chercher cette balise qui peut se présenter de deux façons <data:post.body/> ou <div class='post-body> cela dépend de votre template.

Juste après cette balise y placer ce code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='3'><b>Billets similaires : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><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&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
Enregistrer le tout.

Pour le personnaliser à votre convenance, vous pouvez paramétrer:
  • L'image rss: il vous suffit de changer l'URL de l'image (http://lh3.ggpht.com/_cNpXRtRph18/S76dASm3WGI/AAAAAAAAEJg/AVmw4HhRdsk/rss.png) par la votre en 16x16 pixels.
  • Le libellé "Billets similaires": remplacez le par ce que vous voulez, exemple: "vous aimerez également"
  • Le nombre résultats paramétré sur 5: changez le chiffre dans cette balise "max-results=5&quot"

Enregistrer un commentaire

Blog 100% dofollow. Faites en 1 suffisamment long pour que google prenne en compte votre commentaire et hop, à vous le lien.
Le blog n'est plus à jour mais je valide toujours les bons commentaires, les autres passent en spam