Une façon simple pour ajouter les boutons de partage twitter, facebook, google+, etc.. à droite ou à gauche de votre blog
Pour permettre à vos visiteurs de partager vos articles, installez les boutons de partage sur votre blog.
Pour ce faire,
Pour permettre à vos visiteurs de partager vos articles, installez les boutons de partage sur votre blog.
Pour ce faire,
- connectez-vous sur votre panneau d'administration
- Cliquez sur ajouter un gadget
- Chercher sur HTML/Javascript
- Copiez et Coller le code suivant
/*-------MBT Floating Sharing Widget------------*/
#floatdiv {
position:fixed;
bottom:15%;
margin-left:-850px;
z-index:10;
float:left;
padding-bottom:2px;
}
#mbtsidebar {
background:#fff;
border-top:0px solid #ddd;
border-left:0px solid #ddd;
border-bottom:0px solid #ddd;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding-left:5px;
width:75px;
margin:0 0 0 5px;
}
.fb_share_count_top {width:60px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:52px
!important;
-moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px
!important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id="floatdiv">
<div id="mbtsidebar">
<table cellpadding="0px" cellspacing="0">
<tr>
<td style="padding:5px 0px 0px 0;">
<a href="http://twitter.com/share" class="twitter-share-button"
data-count="vertical" data-via="palabreinfo">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</td>
</tr>
<tr>
<td>
<a name="fb_share" type="box_count"
href="http://www.facebook.com/sharer.php">Share</a><script
src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript"></script>
</td>
</tr>
<tr>
<td style=" padding:5px 0px 0px 0px;">
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: 'en-US'} </script>
<g:plusone size="Tall" expr:href="data:post.url">
</g:plusone></td>
</tr>
<tr>
<td>
<iframe src="http://www.facebook.com/plugins/like.php?href=http://palabre-infos.blogspot.com/
&layout=box_count
&show_faces=true
&width=60
&action=like
&font=arial
&colorscheme=light
&height=65"
scrolling="no"
frameborder="0"
style="border:none; overflow:hidden; width:60px; height:65px; margin-top:3px;"
allowtransparency="true"></iframe>
</td>
</tr>
<tr>
<td style=" padding:5px 0px 0px 0px;">
<div class="addinto_sharebox addinto_sharebox_default">
<a class="addinto_button_more"></a>
</div>
<script type="text/javascript" src="http://static.addinto.com/ai/ai2_bkmk.js"></script>
</td>
</tr>
</table> <div id='mainright'>
5. Remplacer les lignes en rouge par vos comptes twitter et facebook respectivement.
Vous pouvez changer aussi l'emplacement du widget. Dans sa forme actuel, il se place à gauche de votre blog.
Pour changer, modifier margin-left: mettre right
6. Enregistrez puis admirer le résultat.
Partager cette astuce :
C'est vraiment très intéressant comme article. Un grand merci pour le rédacteur. Je crois que ce sera une grande aide pour ajouter des plus à nos connaissances.
RépondreSupprimer