Comment ajouter une barre latérale flottante à un site WordPress

Article écrit par:
  • WordPress
  • Mise à jour: Sep 13, 2017

Les barres latérales flottantes sont pratiques lorsque vous souhaitez garder une facette ou une partie de votre site Web accessible au lecteur à tout moment. L’objectif principal de l’accessibilité est donc que l’utilisateur voie presque toujours le contenu présenté dans une barre latérale flottante.

C’est pour cette raison même que de nombreux sites Web utilisent une barre d’actions flottante. Ces barres latérales sont toujours visibles et facilement accessibles au visiteur. Cela augmente la probabilité qu'un visiteur partage votre contenu.

De même, les webmasters ont tendance à afficher leur meilleur contenu dans la partie la plus accessible du site. Cela garde ce que vous voulez dans le champ de vision de vos visiteurs à tout moment.

Besoin d'aide pour peaufiner votre site WordPress?
WHSR est désormais partenaire de Codeable.io pour aider les utilisateurs ayant besoin de services professionnels de développement / personnalisation de WP.

Pour obtenir un devis gratuit, veuillez remplir ce formulaire de demande.

Un excellent exemple de quelque chose qui peut être ajouté à une barre latérale flottante, consultez Article de WHSR sur la sécurité des médias sociaux.

Exemple

Dans ce cas particulier, Jerry propose de fournir à un visiteur un livre électronique expliquant comment démarrer et gérer un blog avec succès. Nous pensons que ce guide est l’un des plus précieux que le WHSR puisse vous fournir. Et nous aimerions que chaque visiteur en prenne connaissance.

L'accès au livre électronique est autorisé si vous fournissez votre adresse électronique. Donc, non seulement nous vous fournissons le livre électronique, mais nous vous abonnons également à notre blog. En d'autres termes, il s'agit d'un formulaire d'abonnement flottant.

Le formulaire d'abonnement flottant sur WHSR est assez difficile à répliquer pour un débutant WP.

Alors, laissez-moi vous montrer comment vous pouvez exploiter la puissance d'une barre latérale flottante avec un petit plugin astucieux, Q2W3 Widget Fixe.

Q2W3 Widget Fixe

q2w3

Une fois que vous avez installé et activé le plugin, le mettre en place est en fait assez facile.

1. Apparences ouvertes> Widgets.

2. Vous verrez les options de la barre latérale, le nombre de barres latérales dépend de votre choix de thème.

3. Sélectionnez l'option de widget fixe et vous avez terminé. Le widget particulier restera en place. Jetez un coup d'œil à la capture d'écran ci-dessous, j'ai corrigé les publications et catégories récentes dans ma barre latérale.

WidgetsSettingsQ2W3

Et le résultat:

Vous pouvez également faire quelques personnalisations avec le plugin.

  • Les marges peuvent être ajustées
  • L'intervalle d'actualisation et la largeur maximale peuvent recevoir une valeur spécifique
  • Les options de plug-in peuvent aider à assurer la compatibilité avec votre thème. Un exemple serait la possibilité d'hériter de la largeur d'un conteneur parent - cela peut changer dans un thème réactif en fonction de la taille de l'écran.

ParamètresQ2W3

Créer des formulaires d'abonnement et des barres de partage flottantes

Si vous voulez créer un autre type de barre latérale flottante, il existe des plugins qui le permettent aussi. Par exemple, si vous souhaitez ajouter une barre de partage flottante ou un formulaire d'abonnement à votre barre latérale, recherchez un plugin de formulaire d'abonnement ou un plugin de partage social.

1. Ajouter un widget de texte à la barre latérale.

2. Ajoutez le code abrégé approprié (fourni par le plug-in) au widget de texte et vous obtiendrez une barre de partage permanente.

L'effet serait similaire à la vidéo ci-dessous, où ils ont créé une barre de partage flottante.

Avec n'importe quel autre plugin, vous pouvez ajouter des fonctionnalités à votre site et les rendre hautement accessibles en ajoutant leurs codes abrégés à un widget texte que vous avez ajouté à la barre latérale. De plus, vous pouvez ajouter du code HTML ou JavaScript personnalisé au widget Texte.

Final Thoughts

Utilisez judicieusement les barres latérales flottantes et optimisez le nombre de partages / réseaux sociaux / nombre d’abonnés ou toute autre fonction pour laquelle vous choisissez d’utiliser le plug-in.

Maintenant, regardez à droite de cet article. Nous avons notre formulaire d’inscription et un guide qui peut vous aider dans vos projets de blogage. Veuillez vous inscrire et tous nos messages parviendront à votre boîte aux lettres.

Si vous utilisez un autre plugin, hacks ou code pour créer une barre latérale flottante, j'aimerais en entendre parler dans la section commentaires.

À propos de Vishnu

Vishnu est un rédacteur pigiste de nuit, travaille comme analyste de données le jour.