Rss Feed Facebook Twitter Google Plus

Posté dans:


vendredi 19 octobre 2012

Widgets blogger|

3 styles de boutons pour les réseaux sociaux

Vous voulez que vos lecteurs visitent vos pages facebook, votre compte twitter votre chaine youtube, votre page google+, ou qu'ils s'abonnent à vos derniers messages, voici 4 façons d'y arriver.

  1. Connectez-vous à  votre http://draft.blogger.com/
  2. Choississez "ajouter un gadget" ==> choisissez "HTLM/Javascript" cliquez sur le +
  3. Copiez le code suivant et collez le dans le champ

Style 1


<style>p#hb_socialicons img {
 /* Spinning Social Icons Widget By HelperBlogger */
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

p#hb_socialicons img:hover {
    -moz-transform: rotate(120deg);
    -webkit-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg);
}

/* Spinning Social Icons Widget By HelperBlogger */
</style>



<center><p id="hb_socialicons">
    <a href="http://www.facebook.com/palabreinfos.leblog/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKnIf20hc7fW9IiTU_i3CCUbcqiKblZpP1hivQWPdLEOjDPWWYrJ2OiD_zT-vSIepEtLdUNNE0vrH2GEA3V9uETMMee3SAzk1bGtmIBx-CIl5O6oN0ZvNT2MAalN6yXoZkNM9MO8Zg_O4/s1600/helperblogger.com-facebook.png" /></a>
    <a href="http://www.twitter.com/Palabreastuces">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAFA-9TiEDbKHP1sZJu1Kz43UFQgeVY5LPeLgIneEz5ETLZv-RXLBqspicHpWQ_K6Rl1RcvaMZcpVJd6xA3oOuXXYnuG-KBC7pEe_DMAmg4LPMZp1L533PgDvGztkU2T_dUPEHHG-ZWSk/s1600/helperblogger.com-twitter.png" /></a>
    <a href="https://plus.google.com/u/0/102800137262211451364">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKpRZLNRExG4aIYZtnSuqGJ11ZHpM1XxjIPz5r9XdtDa-gnFdKavWwXQKM293iD5Mz4ERDxYnas7NvGJ_MsvEwc4rR7gM0nhiy5IuVpHu2XRmGLMiwTFwAOKRuPcLhbVNQ0LRMqaPU-Ug/s1600/helperblogger.com-google_plus.png" /></a>
    <a href="http://www.feeds.feedburner.com/palabreastuces/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf35OV3-yzZ57Bf9L9N1pbkqMD1nAu5s1EqsqDR2dPzMh0ELiveKepBD7gU4AXYqGEeoJPjT4LIY8EAWlnvDDmoa40z7YAk4iAIliisKc0GhqpXJgykcVrG-RZQS1zCRMA3haI9JQ3o6M/s1600/helperblogger.com-rss.png" /></a>
    <a href="http://www.youtube.com/PALABREVIDEOS/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSxHsYwcjIZ6fdA8_wZC_T4VDhawrz-V010yX9xJWMuirlgx7zJwG5y90hyphenhyphenYMWlzCl-QMbOG5mTfLZml9-WKOeDtXx_p5lmABflSnx_oDuFx0vfFjDeZhf89k6gTlh5RRmi3IKfbzK7iw/s1600/helperblogger.com-youtube.png" /></a>
</p></center>


Style 2


Code à  copier et à  coler
<style>p#hb_socialicons img {
 /* Spinning Social Icons Widget By HelperBlogger */
    -moz-transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -ms-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}
p#hb_socialicons img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
/* Spinning Social Icons Widget By HelperBlogger */
</style> 
<center><p id="hb_socialicons">
    <a href="http://www.facebook.com/nom de votre page ou profil/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKnIf20hc7fW9IiTU_i3CCUbcqiKblZpP1hivQWPdLEOjDPWWYrJ2OiD_zT-vSIepEtLdUNNE0vrH2GEA3V9uETMMee3SAzk1bGtmIBx-CIl5O6oN0ZvNT2MAalN6yXoZkNM9MO8Zg_O4/s1600/helperblogger.com-facebook.png" /></a>
    <a href="http://www.twitter.com/votre compte twitter/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAFA-9TiEDbKHP1sZJu1Kz43UFQgeVY5LPeLgIneEz5ETLZv-RXLBqspicHpWQ_K6Rl1RcvaMZcpVJd6xA3oOuXXYnuG-KBC7pEe_DMAmg4LPMZp1L533PgDvGztkU2T_dUPEHHG-ZWSk/s1600/helperblogger.com-twitter.png" /></a>
    <a href="https://plus.google.com/u/0/votre ID google plus">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKpRZLNRExG4aIYZtnSuqGJ11ZHpM1XxjIPz5r9XdtDa-gnFdKavWwXQKM293iD5Mz4ERDxYnas7NvGJ_MsvEwc4rR7gM0nhiy5IuVpHu2XRmGLMiwTFwAOKRuPcLhbVNQ0LRMqaPU-Ug/s1600/helperblogger.com-google_plus.png" /></a>
    <a href="http://www.feeds.feedburner.com/nom de votre flux feedburner/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf35OV3-yzZ57Bf9L9N1pbkqMD1nAu5s1EqsqDR2dPzMh0ELiveKepBD7gU4AXYqGEeoJPjT4LIY8EAWlnvDDmoa40z7YAk4iAIliisKc0GhqpXJgykcVrG-RZQS1zCRMA3haI9JQ3o6M/s1600/helperblogger.com-rss.png" /></a>
    <a href="http://www.youtube.com/votre profil youtube/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSxHsYwcjIZ6fdA8_wZC_T4VDhawrz-V010yX9xJWMuirlgx7zJwG5y90hyphenhyphenYMWlzCl-QMbOG5mTfLZml9-WKOeDtXx_p5lmABflSnx_oDuFx0vfFjDeZhf89k6gTlh5RRmi3IKfbzK7iw/s1600/helperblogger.com-youtube.png" /></a>
</p></center>

Style 3



Code à copier et à coller

<style>p#hb_socialicons img {
 /* Spinning Social Icons Widget By HelperBlogger */
    -moz-transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -ms-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}
p#hb_socialicons img:hover {
    -moz-transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg);
}
/* Spinning Social Icons Widget By HelperBlogger */
</style>







<center><p id="hb_socialicons">
<a href="http://www.facebook.com/nom de votre page ou profil/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKnIf20hc7fW9IiTU_i3CCUbcqiKblZpP1hivQWPdLEOjDPWWYrJ2OiD_zT-vSIepEtLdUNNE0vrH2GEA3V9uETMMee3SAzk1bGtmIBx-CIl5O6oN0ZvNT2MAalN6yXoZkNM9MO8Zg_O4/s1600/helperblogger.com-facebook.png" /></a>
<a href="http://www.twitter.com/votre compte twitter/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAFA-9TiEDbKHP1sZJu1Kz43UFQgeVY5LPeLgIneEz5ETLZv-RXLBqspicHpWQ_K6Rl1RcvaMZcpVJd6xA3oOuXXYnuG-KBC7pEe_DMAmg4LPMZp1L533PgDvGztkU2T_dUPEHHG-ZWSk/s1600/helperblogger.com-twitter.png" /></a>
<a href="https://plus.google.com/u/0/votre ID google plus">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKpRZLNRExG4aIYZtnSuqGJ11ZHpM1XxjIPz5r9XdtDa-gnFdKavWwXQKM293iD5Mz4ERDxYnas7NvGJ_MsvEwc4rR7gM0nhiy5IuVpHu2XRmGLMiwTFwAOKRuPcLhbVNQ0LRMqaPU-Ug/s1600/helperblogger.com-google_plus.png" /></a>
<a href="http://www.feeds.feedburner.com/nom de votre flux feedburner/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf35OV3-yzZ57Bf9L9N1pbkqMD1nAu5s1EqsqDR2dPzMh0ELiveKepBD7gU4AXYqGEeoJPjT4LIY8EAWlnvDDmoa40z7YAk4iAIliisKc0GhqpXJgykcVrG-RZQS1zCRMA3haI9JQ3o6M/s1600/helperblogger.com-rss.png" /></a>
<a href="http://www.youtube.com/votre profil youtube/">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSxHsYwcjIZ6fdA8_wZC_T4VDhawrz-V010yX9xJWMuirlgx7zJwG5y90hyphenhyphenYMWlzCl-QMbOG5mTfLZml9-WKOeDtXx_p5lmABflSnx_oDuFx0vfFjDeZhf89k6gTlh5RRmi3IKfbzK7iw/s1600/helperblogger.com-youtube.png" /></a>
</p></center>


Partager cette astuce :

0 commentaires:

Enregistrer un commentaire

Autres astuces

 

Commentaires récents

PALABRE-INFOS_le fil actu

3 Astuces Récentes

Plus d'astuces

Trouvez une astuce