Sur le même sujet:
Article mis à jour le 25/05/2013.
Afin de mieux faire connaître votre blog, augmenter les visiteurs et capter ceux qui sont intéressés par le thème de votre blog, je vous propose d'ajouter les boutons de partage des différents réseaux sociaux dans une barre flottante, qui augmentera certainement le nombre de partages de vos articles dans les réseaux sociaux.
Tuto d'intégration de barre flottante de boutons de partage
Etape 1: Ajouter le widget.
Connectez vous à votre blog, choisissez 'Mise en page', puis 'Ajouter un gadget'.
Dans la liste des widgets proposés, choisissez le 11ème ( HTML/JavaScript ).
Maintenant, dirigez vous vers: https://www.addthis.com/get/sharing , créez un compte et choisissez votre modèle de barre.
En rouge: Choisir votre modèle de barre
En vert: cliquez sur le texte en bleu, qui ouvrira une zone qui vous permettra d'ajouter/supprimer de nouveaux boutons.
En bleu: Une fois fini, copier le code obtenu dans cette zone. Il ressemblera à celui en dessous.
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_floating_style addthis_counter_style" style="left:50px; top:50px; background:#ffffff">
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
<a class="addthis_button_tweet" tw:count="vertical"></a>
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
<a class="addthis_counter"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":false};</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4fd535806d556861"></script>
<!-- AddThis Button END -->
Etape 2: Personnaliser la barre.
Une fois le code ajouté, soit on le valide et on clique sur enregistrer. Il aura l'apparence de la barre sur le blog des tests.
Soit on le personnalise, en modifiant les couleurs et ajoutant d'autres boutons de partage.
Le code en mauve, contient 3 propriétés CSS:
- left: La distance entre la barre et la zone de votre blog, la valeur par défaut est 50px, plus elle grandit, plus la distance s'éloigne.
- top: La distance entre la barre et le haut du blog, la valeur par défaut est 50px, plus elle grandit, plus la distance s'éloigne.
- background: La couleur d'arrière plan de cette barre, par défaut c'est #ffffff (blanc), vous pouvez la modifier par votre couleur preferée, en la choisissant içi.
- Cette barre est modifiable à volonté, vous pouvez ajouter n'importe quelle propriété CSS pour la personnaliser à votre goût.
Voilà, c'était environ tout.
