Afficher tous ses abonnés fidèles

Nous savons que depuis quelques temps, Blogger propose le widget «Abonnés fidèles », qui affiche les avatars des abonnés au blog via les services de Blogger (qui est maintenant couplé avec Google Friend connect).

Seulement, vous devez avoir remarqué que quand on a dépassé un certain nombre d’abonnés, seul une partie de ceux-ci est affiché sur le widget inséré sur le blog. Il existe heureusement, un moyen pour afficher tous les abonnés.  Le code que nous allons proposer, peut être mis dans un article spécial, que vous pourrez intituler « Les abonnés du Blog », article dont vous pourrez afficher le lien sur toutes les pages du blog ou sur le menu principal. Cette astuce est à mettre sur le compte de Vin, de Blog Doctor.

Ceux qui veulent afficher tous les abonnés fidèles de leur blog doivent :

1. Afficher le code pour les abonnés fidèles sur le blog (cliquer sur le lien pour lire l’article sur la procédure à suivre) ;

2. Aller sur Modifier le code HTML et cocher sur la case « Développer de modèles de gadget » ;

3.Trouver le code suivant :

<!-- Include the Google Friend Connect javascript library. -->

<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>

<!-- Define the div tag where the gadget will be inserted. -->

<div id="div-xxxxxxxxxxxxxxxx" style="width:282px;border:1px solid #cccccc;"></div>

<!-- Render the gadget into a div. -->

<script type="text/javascript">

var skin = {};

skin['HEIGHT'] = '385';

skin['BORDER_COLOR'] = '#cccccc';

skin['ENDCAP_BG_COLOR'] = '#e0ecff';

skin['ENDCAP_TEXT_COLOR'] = '#333333';

skin['ENDCAP_LINK_COLOR'] = '#0000cc';

skin['ALTERNATE_BG_COLOR'] = '#ffffff';

skin['CONTENT_BG_COLOR'] = '#ffffff';

skin['CONTENT_LINK_COLOR'] = '#0000cc';

skin['CONTENT_TEXT_COLOR'] = '#333333';

skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';

skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';

skin['CONTENT_HEADLINE_COLOR'] = '#333333';

google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);

google.friendconnect.container.renderMembersGadget(

 { id: 'div-XXXXXXXXXXXXX',

   site: 'XXXXXXXXXXXXXXXXXXXXXXXX' },

  skin);

</script>

4. Si vous allez le mettre dans un article, copier le code trouvé dans votre modèle.

Quelque soit l’utilisation à la laquelle vous allez destiner le widget transformé, voir le style="width:282px; à la quatrième ligne du code et remplace 282px par 100%.

5. Vous pouvez aussi changer les couleurs du widget pour qu’il s’harmonise avec le blog en changeant les valeurs hexadécimales de couleurs sur la partie suivante du code :

skin['BORDER_COLOR'] = '#cccccc'; (couleur de la bordure)

skin['ENDCAP_BG_COLOR'] = '#e0ecff'; (couleur de fond du bandeau)

skin['ENDCAP_TEXT_COLOR'] = '#333333'; (couleur du texte dans le bandeau : Abonnés fidels)

skin['ENDCAP_LINK_COLOR'] = '#0000cc';  (couleur du lien)

skin['ALTERNATE_BG_COLOR'] = '#ffffff'; (autre couleur de fond)

6. Quand vous avez fini, enregistrez votre modèle (ou publiez l’article dans lequel vous avez inséré le code) et allez voir les résultats.

@+