Tutoriel : Stylez vos boutons de partage

[Solie]

Tutoriel : Stylez vos boutons de partage

Le présent tutoriel vous permettra d'accorder vos boutons de partage sur les réseaux sociaux avec les couleurs de votre site.



Vous conserverez l'effet Rollover grossissant de Jimdo au passage de la souris.

Démo


Au choix, deux tailles d'icônes (la moyenne 32px ou la grande 64px), et les trois formes (carrée, ronde, ou hexagonale).


cliquez sur l'image pour agrandir

TUTORIEL

Étape 1

Ajoutez un élément "Partager" en cliquant sur + ajouter un élément.


Cochez les réseaux sociaux ou outils (partager par e-mail) que vous souhaitez ajouter sur votre page.


cliquez sur les images pour agrandir


Choisissez l'emplacement de vos icônes :
    à gauche
    centre
    à droite

Choisissez la taille de vos icônes :
    32px
    64px

Choisissez le format de vos icônes :
    carré
    rond
    hexagonal

Choisissez la couleur de base de vos icônes :
    noir & blanc (black)
    transparent (white)

Enregistrez.

Étape 2

Cliquez sur Paramètres > Modifier le head.





Si vous avez choisi la couleur "noir & blanc", entrez ce code :

Code:

<style type="text/css">
/*<![CDATA[*/

/* changer la couleur des boutons share noir & blanc*/
div.cc-sharebuttons-element.cc-sharebuttons-style-black a::before {color: #BACF22;}

/*]]>*/
</style>

La référence couleur #BACF22 (qui correspond ici à un vert pomme avec logo blanc) est à remplacer par la couleur de votre choix.



Si vous avez choisi la couleur "transparent", entrez ce code :

Code:

<style type="text/css">
/*<![CDATA[*/

/* changer la couleur des boutons share transparent */
div.cc-sharebuttons-element.cc-sharebuttons-style-white a::before {color: #BACF22;}

/*]]>*/
</style>

La référence couleur #BACF22 (qui correspond ici au vert pomme avec logo gris de la première photo) est à remplacer par la couleur de votre choix.


Enregistrez et fermez les paramètres.



Rafraîchissez votre page pour voir le résultat