Viluxus

"Say something about your blog here"

Affichage des articles dont le libellé est Outils Blogger. Afficher tous les articles
Affichage des articles dont le libellé est Outils Blogger. Afficher tous les articles

samedi 4 juin 2011

Butons de partage : Facebook, Google Buzz et Twitter



Bismillah. Bienvenue sur Outils Blogger www.outils-blogger.blogspot.com : Outils, Astuces, Widgets, Modèles, Adsense, Seo.

Facebook, Twitter et Google Buzz vous permettent aussi de partager vos sujets avec des boutons qui affichent le nombre de partage.

 

Exemple du widget : 


J'ai essayé de collecter tous ces boutons dans le code suivant :
<table border='0' height='20' width='541'>
    <tr>
        <td width='8'><div style='float:left;padding:4px;'>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>  </td>
        <td width='8'><div style='float:left;padding:4px;'>
<a class='twitter-share-button' data-count='horizontal' data-lang='fr' data-related='
Outils Blogger : Outils, Astuces, Widgets, Modèles, Adsense, Seo' data-via='Outils Blogger' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow'/>
<b:if cond='data:post.isFirstPost'>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</b:if>
</div></td>
        <td width='8'><div style='float:left;padding:4px;'>
<a class='google-buzz-button' data-button-style='small-count' data-locale='en_IN' expr:data-url='data:post.url' href='http://www.google.com/buzz/post' rel='nofollow' title='Partager sur Google Buzz'/>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/>
</div></td>
        <td/>
    </tr>
</table>

Outils Blogger www.outils-blogger.blogspot.com : Outils, Astuces, Widgets, Modèles, Adsense, Seo.
Orientez vers : Présentation --> Modifier le code HTML --> Développer des modèles de gadgets

Pour ajouter ces boutons comme dans l'example, placer le code juste après le code suivant :

    <div class='post-header-line-1'/>

Ou placer le code 
avant : <data:post.body/> , pour afficher les boutons avant le sujet
après : <data:post.body/> , pour afficher les boutons après le sujet


Outils Blogger www.outils-blogger.blogspot.com : Outils, Astuces, Widgets, Modèles, Adsense, Seo.

Remarque : s'il y en a deux code  <data:post.body/> choisissez le deuxième
Important : Changer le codedata-related='Outils Blogger:Widgets, Astuces, Thèmes, Modèles blogger' data-via='OutilsBlogger'
par ce qui correspand à votre blog
data-related= Description
data-via= Votre compte Twitter

Outils Blogger www.outils-blogger.blogspot.com : Outils, Astuces, Widgets, Modèles, Adsense, Seo.