Webmarketing

Comment créer une Hello Bar d’auto promotion sur WordPress ?

wordpress hello bar

Dans ce nouveau tutoriel WordPress, nous allons vous présenter comment très simplement ajouter une barre d’auto-promotion avec call to action en haut ou en bas de votre site WordPress.

S’il vous est possible de coder ce type de barre avec bouton d’action assez simplement avec un peu de connaissances en HTML et CSS, nous allons ici vous présenter comment le faire en quelques clics, gratuitement, sans le moindre besoin de connaissances HTML et CSS.

Si ce n’est pas la première fois que vous venez sur le site, vous avez surement remarqué que nous faisions jusqu’à maintenant la promotion de notre Newsletter au travers d’une barre d’auto-promotion que nous placions jusqu’à présent en bas de notre site (sauf sur les smartphones ou elle s’affichait en haut avant le menu et le contenu).

Nous l’avons désormais remplacée par une barre noire en haut du site, sur PC et smartphone, pour tester si le taux de conversion est plus ou moins intéressant que la précédente version.

Dans ce tutoriel, nous allons vous présenter le plugin qui nous a permis de faire cela en quelques minutes et surtout, gratuitement, sans avoir besoin d’un développeur spécialisé WordPress (ce plugin est une alternative gratuite très intéressante au plus connu plugin WordPress Hello Bar).

Quel est le meilleur plugin WordPress gratuit pour créer une barre de promotion fixe au scroll ?

quickie bar WordPress

Après avoir testé de nombreux plugins, nous avons fini par trouver et tester Quickie Bar, un plugin WordPress gratuit assez complet qui propose une interface d’administration très agréable et surtout très facile à configurer.

Ce plugin vous permet de créer autant de barres que vous le souhaitez dans sa version gratuite.

Voici comment faire pour ajouter cette barre à votre site :

  • La première étape consiste à télécharger le plugin et l’envoyer sur votre site via FTP (vous pouvez aussi le rechercher et l’installer directement depuis la section « Extensions » de votre blog / site WordPress).
  • Une fois le plugin installé, vous devez l’activer.
  • Après activation, un nouvel onglet « QuickieBar » s’affichera dans votre interface d’administration WordPress sur votre gauche.
  • Pour créer et mettre en ligne votre première barre d’auto-promotion, vous devrez dans un premier temps configurer quelques paramètres comme ceci :

paramètres quickie bar

Nous vous conseillons de régler la section « attribution » sur « no attribution » pour éviter que vos utilisateurs ne voient apparaître une mention « Quickie Bar » sur votre barre.

Vous pouvez aussi sur cette page directement choisir sur quels types de page afficher votre barre d’auto-promotion, par défaut, nous vous conseillons de la faire apparaître partout « Everywhere » mais tout dépendra de votre site et de vos objectifs.

Si votre site dispose déjà d’une barre de navigation fixe au scroll, il vous faudra régler le 3ème paramétrage sur « ON » (même si votre barre ne sera du coup pas visible sur les terminaux mobiles à la suite de ce réglage).

Enfin, si lorsque votre barre est en ligne, vous vous apercevez qu’elle est parfois derrière des éléments de votre site, il vous suffira d’augmenter le Z-index de cette dernière en optant pour « 100000 » pour être assuré qu’elle s’affichera toujours au dessus de tous les autres éléments de votre site.

La section Debug ne devrait pas vous être utile, assurez vous simplement que le réglage est bien sur « OFF ».

  • Après avoir paramétré ces premiers réglages, n’oubliez pas d’enregistrer puis cliquer sur la section « Bars » pour créer votre première barre d’auto-promotion.

liste barres wordpress

En accédant à cette section « Bars », vous pourrez visualiser les anciennes barres inactives mais aussi celle actuellement active. Pour notre part, nous avons déjà testé 3 formats avec les résultats que vous pouvez constater.

Nous venons tout juste de lancer une nouvelle version qui semble avoir un taux de conversion un peu plus important que les autres alors que seuls quelques éléments ont été modifiés (couleur, ajout de gras et emplacement en haut du site).

Il est très important de tester différents formats pour déterminer ceux qui obtiennent le plus de conversions (ici seuls les clics sont trackés par QuickieBar).

  • Si vous souhaitez créer votre première barre, il vous suffira de cliquer sur le bouton « Create à new bar » :

créer header bar WordPress

Après avoir cliqué sur ce bouton, il vous sera possible de configurer très simplement les premiers paramètres de votre barre.

Vous pouvez ajouter des icones au texte qui précède votre bouton d’appel à l’action mais aussi au texte inclus dans votre bouton.

Un champ pour ajouter l’URL de redirection est bien entendu présent (le bouton de droite vous permet de tester l’URL pour être sûr qu’elle ne redirige pas vers une erreur 404).

Le plugin QuickieBar vous permet de visualiser en live votre barre à mesure que vous la modifiez dans l’interface d’administration. Vous n’aurez donc aucune surprise lorsqu’elle sera active sur votre site.

  • Une fois votre texte et lien ajouté, vous pouvez choisir parmi quelques thèmes proposés ou créer le votre en insérant les codes couleur qui correspondent à la charte graphique de votre site (pour obtenir les codes couleur de votre site, vous pouvez soit utiliser la pipette de Photoshop ou faire un clic droit => « inspecter l’élément » pour obtenir le code couleur présent dans le CSS de votre site).
  • Après avoir terminé la configuration des couleurs de votre barre, plusieurs paramètres additionnels vous permettront de définir des éléments importants comme :
    • la taille de la barre,
    • son emplacement (en bas ou en haut) sur votre site,
    • si le lien doit renvoyer dans un nouvel onglet ou non,
    • si une croix de fermeture de la barre doit s’afficher ou non,
    • la forme que le bouton d’action devra avoir,

Autres paramètres hello bar

derniers réglages quickiebar

  • Après avoir configuré tous les paramètres en fonction de vos besoins, il ne vous restera plus qu’à enregistrer et publier votre barre sur votre site (après l’avoir testée bien entendu). Pour la publier, il vous suffit de cliquer sur « Create & Publish ». Si vous souhaitez simplement créer une barre que vous passerez en ligne plus tard, cliquez simplement sur « Create », vous pourrez ultérieurement décider de la passer en ligne ou non.

Pour aller plus loin si vous le souhaitez

Si la version gratuite de QuickieBar est à mon avis largement suffisante pour de nombreux sites WordPress, Quickie Bar propose aussi une version payante avec un plus de fonctionnalités (à partir de 29$ pour un site et jusqu’à 59$ pour autant de sites que vous le souhaitez) :

  • vous pouvez avec la version payante avoir plusieurs barres actives à différents endroits de votre site en même temps.
  • vous pouvez collecter des emails directement depuis la header bar (en les intégrant automatiquement dans une liste comme celles de Mailchimp).
  • vous pouvez tester plusieurs barres en même temps pour voir celles qui convertissent le mieux (dans la version gratuite on peut le faire mais uniquement en activant et désactivant les barres manuellement).
  • vous pouvez déclencher le déploiement d’une barre en fonction d’éléments spécifiques comme une durée de visite ou un pourcentage de page scrollée par exemple.
  • d’autres polices d’écriture sont aussi proposées dans la version premium.

Si ce plugin gratuit ne vous convient pas, vous pouvez aussi découvrir tous les plugins professionnels similaires disponibles sur Codecanyon.

Comment créer une Hello Bar d’auto promotion sur WordPress ?
5 - 2 votes

2 Commentaires

2 Comments

  1. Véronique

    22 août 2016 à 16 h 10 min

    Bonjour,
    Quelles sont les principales différences entre QuickiesBar et Hello Bar ?
    Cordialement
    Véronique

    • Vincent Brossas

      23 août 2016 à 7 h 24 min

      Bonjour Véronique,
      L’une est 100% gratuite et propose des statistiques sur les clics (QuickieBar), l’autre est payante et ajoute un H à gauche de votre barre.
      Bonne journée

Répondre

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

LEPTIDIGITAL est un blog vous proposant le meilleur de l'actualité digitale (SEO, Webmarketing, Social Media, SEA, Emailing, E-commerce, ...)

LA NEWSLETTER LEPTIDIGITAL

Recevez nos meilleurs articles en 1 clic !

UN PETIT LIKE ?

haut