L'ajout d'une barre de partage social flottante peut grandement améliorer la visibilité de votre contenu et encourager les lecteurs à le promouvoir sur les réseaux sociaux. Une barre flottante reste avec l'utilisateur pendant qu'il fait défiler, ce qui permet de partager facilement le contenu à tout moment.
En gérant nos propres sites, nous avons constaté l'impact des barres de partage social flottantes sur l'engagement et l'augmentation du trafic. En ajoutant stratégiquement cette fonctionnalité à nos sites Web, nous avons observé une amélioration notable des partages sociaux et une portée plus large pour notre contenu.
Que vous gériez un blog ou une entreprise, l'ajout d'une barre de partage social flottante peut être un moyen simple d'encourager l'engagement et d'étendre votre présence en ligne.
Dans cet article, nous vous guiderons tout au long du processus d'ajout d'une barre de partage social flottante à votre site WordPress. Nos instructions étape par étape le rendent simple, même pour les débutants.
Pourquoi ajouter une barre de partage social flottante dans WordPress ?
L'ajout d'une barre de partage social proéminente permet aux visiteurs de partager facilement votre contenu sur des plateformes de médias sociaux comme Instagram, Facebook et Twitter. En gardant cette barre visible pendant le défilement, vous offrez aux utilisateurs un moyen pratique de partager votre contenu à tout moment.
Cela peut entraîner une augmentation de l'engagement, du trafic et de la notoriété de la marque. De plus, cela peut motiver les utilisateurs à laisser des commentaires et des j'aime ou à suivre vos mises à jour.
En dehors de cela, une barre de partage social flottante peut indirectement améliorer le classement de votre site Web en augmentant les signaux sociaux. Lorsque les utilisateurs partagent votre contenu sur les réseaux sociaux, cela génère des backlinks vers votre site Web, ce qui peut avoir un impact positif sur votre classement dans les moteurs de recherche.
Cela dit, examinons comment ajouter facilement une barre de partage social flottante dans WordPress. Dans ce tutoriel, nous aborderons une méthode par code et une méthode par plugin. Vous pouvez utiliser les liens ci-dessous pour accéder à l'approche de votre choix :
- Méthode 1 : Ajouter une barre de partage social flottante avec WPCode
- Méthode 2 : Ajouter une barre de partage social flottante avec un plugin
- Bonus : Ajouter une barre sociale flottante dans WordPress
Méthode 1 : Ajouter une barre de partage social flottante avec WPCode
Si vous recherchez un moyen personnalisable et facile d'ajouter une barre de partage social flottante dans WordPress, alors cette méthode est faite pour vous.
Pour cette approche, nous utiliserons WPCode car c'est le meilleur plugin de snippets de code WordPress du marché. Pour plus d'informations sur cet outil, consultez notre avis complet sur WPCode.
WPCode dispose d'une vaste bibliothèque de snippets de code préfabriqués, y compris une solution prête à l'emploi pour ajouter une barre de partage social flottante. Cela élimine le besoin de codage personnalisé et facilite la mise en œuvre de cette fonctionnalité sur votre site Web.
Tout d'abord, vous devez installer et activer le plugin WPCode. Pour plus d'informations, consultez notre guide pour débutants sur comment installer un plugin WordPress.
Remarque : WPCode dispose d'une version gratuite. Cependant, pour débloquer la bibliothèque de snippets de code, vous aurez besoin du plan pro du plugin.
Après l'activation, rendez-vous sur la page Snippets de code » + Ajouter un snippet depuis le tableau de bord WordPress et utilisez la boîte de recherche pour localiser le snippet « Icônes flottantes de médias sociaux ».
Une fois que vous avez fait cela, cliquez simplement sur le bouton « Utiliser le snippet » en dessous.
Cela ouvrira la page « Modifier le snippet » sur votre écran. Vous remarquerez que le snippet de code pour la barre flottante de partage sur les réseaux sociaux, avec des liens vers Facebook, Instagram, Twitter et LinkedIn, a déjà été ajouté à la boîte « Aperçu du code ».
Vous pouvez maintenant utiliser le snippet de code tel quel ou faire défiler vers le bas et modifier la position, la marge, la largeur, la couleur d'arrière-plan, la hauteur et le rayon des bordures des icônes.
Par exemple, la couleur d'arrière-plan de ces icônes de médias sociaux est noire par défaut. Cependant, vous pouvez la remplacer par le code hexadécimal d'une couleur qui correspond mieux à votre marque.
Après cela, faites défiler vers le haut et basculez le commutateur « Inactif » sur « Actif ».
Ensuite, cliquez sur le bouton « Mettre à jour » pour enregistrer vos paramètres et ajouter une barre de partage social flottante.
Vous pouvez maintenant visiter votre site Web pour voir les icônes de médias sociaux en action.
Voici à quoi cela ressemblait sur notre site Web de démonstration.
Méthode 2 : Ajouter une barre de partage social flottante avec un plugin
Si vous ne souhaitez pas utiliser de code personnalisé sur votre site Web, cette méthode est faite pour vous. Cela dit, gardez à l'esprit que vous n'aurez pas autant d'options de personnalisation avec cette approche.
Tout d'abord, vous devez installer et activer le plugin Floating Social Share Icons. Pour plus de détails, consultez notre tutoriel sur comment installer un plugin WordPress.
Après l'activation, visitez la page Floating Links & Social Icons depuis le tableau de bord WordPress. Par défaut, le plugin ajoutera automatiquement des icônes flottantes qui permettront aux utilisateurs de visiter la page d'accueil, l'article suivant, l'article précédent, le haut de la page et le bas de la page, et de copier l'URL actuelle.
Cependant, si vous n'avez besoin d'aucune de ces fonctionnalités, vous pouvez désactiver ces options. Une fois que vous aurez fait cela, vos modifications seront synchronisées automatiquement.
Après cela, dirigez-vous vers la page Floating Links & Social Icons » Social Icons depuis la barre latérale d'administration.
Pour personnaliser votre barre de partage social flottante, il suffit de basculer le commutateur à côté des plateformes de médias sociaux souhaitées. Cela fera apparaître les icônes correspondantes sur votre barre, permettant aux visiteurs de partager facilement votre contenu.
Vos paramètres seront enregistrés automatiquement une fois que vous aurez effectué les modifications.
Ensuite, vous pouvez visiter votre site WordPress pour voir la barre de partage social flottante en action.
Bonus : Ajouter une barre sociale flottante dans WordPress
Si vous le souhaitez, vous pouvez également ajouter une barre sociale flottante avec des boutons de suivi dans WordPress.
Cela permet aux visiteurs de se connecter facilement à vos profils de médias sociaux et de rester informés de vos dernières actualités et événements. En rendant pratique pour les utilisateurs de vous suivre sur les médias sociaux, vous pouvez élargir votre portée et favoriser une communauté dévouée.
Pour ce faire, vous aurez besoin d'OptinMonster, qui est le meilleur outil de génération de prospects sur le marché. De plus, il est livré avec un modèle prédéfini pour créer une barre sociale flottante.
Tout d'abord, visitez le site web d'OptinMonster et créez un compte. N'oubliez pas que vous devrez acheter le plan Basic car il inclut le type de campagne Barre flottante.
Ensuite, rendez-vous sur votre tableau de bord WordPress pour installer et activer le plugin connecteur OptinMonster. Pour plus de détails, consultez notre tutoriel sur comment installer un plugin WordPress.
Après l'activation, vous verrez l'écran de bienvenue et l'assistant de configuration. Cliquez sur le bouton « Connecter votre compte existant ».
Vous pouvez ensuite suivre les instructions à l'écran pour connecter votre compte OptinMonster à WordPress.
Une fois cela fait, rendez-vous sur la page OptinMonster » Modèles depuis le tableau de bord WordPress et sélectionnez « Barre flottante » comme type de campagne.
Ensuite, cliquez sur le bouton « Utiliser le modèle » pour le modèle « Suivre sur les réseaux sociaux ». Cela ouvrira une invite où vous devrez ajouter un nom pour la campagne que vous êtes sur le point de créer.
Le constructeur par glisser-déposer d'OptinMonster se lancera maintenant sur votre écran.
C'est ici que vous pouvez concevoir votre barre flottante.
Le plugin propose différents blocs que vous pouvez simplement faire glisser et déposer sur le modèle. Par exemple, vous pouvez ajouter une image, du texte, un bouton, et plus encore à votre barre de réseaux sociaux.
Pour en savoir plus, consultez notre tutoriel sur comment ajouter une barre d'alerte dans WordPress.
Après cela, cliquez sur les boutons de suivi des réseaux sociaux dans la barre flottante. Cela ouvrira de nouveaux paramètres dans la colonne de gauche.
Ici, vous pouvez ajouter l'URL de vos pages Facebook, Instagram et Twitter en conséquence.
Une fois que vous avez terminé, passez à l'onglet « Publier » en haut et changez le statut de la campagne en « Publier ». Ensuite, vous devrez cliquer sur le bouton « Enregistrer » et fermer le constructeur visuel.
Vous pouvez maintenant visiter votre site WordPress pour voir la barre sociale flottante en action.
Nous espérons que cet article vous a aidé à apprendre comment ajouter une barre de partage social flottante dans WordPress. Vous voudrez peut-être aussi consulter notre guide pour débutants sur comment ajouter des boutons de partage social dans WordPress et nos meilleurs choix pour les meilleurs plugins de médias sociaux pour développer votre site.
Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.
zak
Quel plugin de médias sociaux utilisez-vous sur ce site ? Parce qu'il a l'air différent de votre barre de partage social flottante ?
Support WPBeginner
Salut zak,
Oui, il est écrit spécifiquement pour WPBeginner.
Admin
Stephanie
Comment ajoutez-vous les boutons de partage en bas de l'article au lieu d'en haut ?
Merci
Ralph Eastwood
Je viens d'installer le plugin. Il a l'air bien. Y a-t-il un moyen d'avoir la barre en bas de l'article ? Cela semble plus logique de l'avoir là. Les gens vont partager un article une fois qu'ils l'ont lu et qu'ils pensent qu'il a de la valeur – je ne veux pas compter sur eux pour remonter jusqu'en haut juste pour partager !
Laura
J'ai installé, activé et ajouté Facebook à la case « services sociaux activés ». Je n'ai pas de compte Twitter, donc j'ai laissé cette partie vide. J'ai enregistré les paramètres mais l'onglet Facebook n'apparaît pas sur mon site web ! Ai-je manqué quelque chose ? Merci
sham
Mon nombre de partages sociaux est revenu à zéro après la migration vers HTTPS. Comment résoudre ce problème ?
Alan
Vos instructions disent : « Ensuite, ajoutez votre identifiant Twitter dans le champ… »
Je n'ai pas de compte Twitter moi-même. Puis-je utiliser ce plugin sans m'inscrire sur Twitter ? (Je suis sur Facebook et LinkedIn.)
Personnel éditorial
N’activez pas le bouton de partage Twitter ou laissez-le simplement vide. Il vous permet d’obtenir plus d’abonnés si vous y entrez votre identifiant Twitter.
Admin
Siska
Je voudrais utiliser ce plugin, mais je ne trouve pas comment changer la couleur de fond… Mon site web n’est pas blanc.
Siska
Je voudrais utiliser ce plugin, mais je ne trouve pas comment changer la couleur de fond… Mon site web n’est pas blanc.
Support WPBeginner
Essayez d’ajouter ceci dans la feuille de style de votre thème :
#fsb-social-bar { border-bottom: 1px solid #f1f1f1; border-top: 1px solid #f1f1f1; padding: 10px 0; margin: 0px 0 20px 0; float: left; background: #222; position: relative; clear: both; }1-click Use in WordPress
Admin
Jean
Merci pour cela ! Comment feriez-vous pour suivre les partages comme objectif dans Google Analytics ?
Elisa
Erreur lors de l'appui sur le bouton google +1. J'obtiens un triangle rouge et je ne peux pas le résoudre.
Aide !!!
Rick
Comment puis-je désactiver l'affichage du nombre de fois où il a été partagé ? Je ne veux pas que le nombre de partages soit affiché.
Rebecca
Salut, beau plugin. J'ai un problème cependant, lorsque j'utilise le bouton "épingler", il rogne la photo. Comment puis-je éviter cela ?
Skwty
Je voulais juste vous prévenir que votre plugin Floating Social Bar causait des problèmes avec mon thème WP-Bold. Il supprimait l'extrait du widget que j'utilisais pour afficher le contenu lié dans la barre latérale. Le titre était là, mais ce n'est que sur single.php que l'extrait disparaissait. Le support de Solostream m'a dit que je devais le signaler. J'ai changé pour un autre plugin à cause de cela, mais je préférerais de loin utiliser le Floating Social Bar.
Merci !
Zomi Daily
Pouvez-vous s'il vous plaît inclure le bouton de partage Facebook, s'il vous plaît ?
Jon Brown
Prévoyez-vous toujours de publier une version qui inclut les comptes de commentaires comme le fait ce site ? Même si ce n'est pas prêt pour la publication, le code est-il public ?
Jorge
Hi! Thanks for the great plugin. I have some questions when people press like or +1 do they share the post in my blog too? How can people share my content from the social bar? What is the capital of North Dakota
Thanks again!
Julius
Excellent plugin, mais malheureusement il consomme beaucoup de ressources. Le plugin P3 montre qu'il consomme 51% de tous mes plugins (j'ai 12 plugins).
Support WPBeginner
Nous l'utilisons sur nos propres sites et nous sommes très attentifs à la vitesse de chargement des pages. Quant au plugin P3, les résultats des tests peuvent être affectés par de nombreux facteurs tels que d'autres services fonctionnant sur votre serveur, si vous êtes sur un serveur partagé, cela affectera également les résultats.
Admin
Urmet
Excellent plugin – j'aimerais savoir une chose – puis-je l'avoir de telle sorte que le compteur se charge immédiatement – comme vous l'avez sur votre propre page – les nombres de partage sont visibles même si je ne survole pas le plugin.
Haider
Excellent Plugin en effet !
I finally activated and modified it a little to suit my theme
J'ai quelques questions :
1. Prévoyez-vous d'inclure le nouveau bouton de partage Facebook en plus du bouton "J'aime" ? Merci d'y réfléchir.
2. Ne serait-il pas préférable de gérer le style avec un fichier CSS séparé plutôt qu'avec du CSS en ligne ? De nombreux thèmes premium offrent une option pour du CSS personnalisé qui est ajouté à l'en-tête ; mais cela ne fonctionne pas dans ce cas. J'ai dû modifier le fichier du plugin pour changer les styles.
Merci beaucoup pour un produit aussi génial !
Jenn Marie
Salut ! D'une personne de haute qualité à une autre : je te vois. Ce plugin déchire, et je suppose que c'est grâce à la méticulosité que je vois dans tout ce que tu fais !
Une question : une idée pourquoi la barre n'est pas fixe pour moi sur iPhone (iOS7) ? J'utilise Point, un thème responsive. J'ai essayé de désactiver d'autres plugins sociaux.