Hé oh… j’ai une nouvelle promotion… Ou alors, hé oh… regardez j’organise un super évènement… tu voudrais sûrement faire cela avec ton site ? créer une bannière publicitaire pour annoncer un super évènement le tout en 5 minutes ? que ton public arrive sur ta page d’accueil, un de tes articles, dans ton e-commerce, page contact… il verra cette barre évènement et ne pourra pas louper cette promo ou évènement.
Un petit aperçu des résultats possibles, bien sûr, la seule limite est ton imagination…
Bannière publicitaire : le plugin
Bannière publicitaire : installation du plugin
Tout d’abord, commence à télécharger le plugin « Simple banner« :
- Pour commencer, survol Extensions.
- Ensuite, clique sur Ajouter.
- Puis, écris « simple banner ».
- Ensuite, clique sur Installer maintenant.
- Enfin, clique sur Activer.
C’est un plugin de Ryan Petersen, il est apprécié avec cinq étoiles sur cinq pour trente-quatre votants. Il est installé sur quarante mille sites et compatible avec mon WordPress, les mises à jour ont été faites il y a trois semaines. Tout est parfait, alors continuons.
Simple banner : les réglages principaux
Maintenant que tu as installé et activé le plugin, nous allons pouvoir cliquer notre barre d’évènement :
- Pour commencer, Clique sur Simple Banner.
- Ensuite, si tu souhaites changer la couleur de fond de ta bannière.
- Tu peux également modifier la couleur du texte de la barre.
- Enfin, si tu souhaites modifier la couleur du lien.
Pour afficher la bannière sur ton site, copie le morceau de code et colle-le dans la zone plus-bas. Assure-toi d’avoir le début du code. Enfin, tout en-bas de la page tu trouveras le bouton Enregistrer les modifications :
Bien sûr, tu t’en doutes, nous n’allons pas garder cette bannière, le message n’est pas terrible et le lien nous dirige vers WordPress, pas top…
Pour commencer, restons dans la zone dans laquelle nous avons collé le code :
- Ensuite, nous allons placer notre message avant le <a…
- Par ailleurs, entre le chevron fermant, tu vas mettre le message de ton lien.
- Enfin, tu vas placer ici l’URL vers laquelle tu souhaites diriger tes visiteurs.
ATTENTION, place bien ton URL entre les doubles apostrophes sinon ton lien ne va pas fonctionner.
Résultat :
Ensuite, pour le second exemple, j’ai agrandi la police d’écriture, puis j’ai défini tout le texte comme lien et j’ai ajouté des émoticônes :
<span style="font-size: 25px;">🇨🇺</span> <a href="https://libreetdigital.com">Vendredi 14 avril 2022 : Soirée salsa, venez-vous inscrire ici, si vous souhaitez danser jusqu'au petit matin...</a> <span style="font-size: 25px;">🇨🇺</span>
</p> Résultat :
Simple banner : désactiver la bannière et utiliser le CSS
Si tu souhaites désactiver la bannière, il te suffit de cocher le bouton Yes de Hide Simple Banner, n’oublie pas d’enregistrer :
Tu souhaites modifier le design te ta super bannière ? si tu connais le CSS tu vas pouvoir le faire ici :
Simple banner : choix du positionnement de la bannière
Ensuite, si tu veux positionner ta barre de promo d’une certaine manière. En choisissant fixed, en scrollant la bannière va rester affichée à l’écran, footer, la barre d’évènement va rester tout en bas…
Très important, vérifie que la bannière s’affiche bien sur les supports mobils, parfois il peut y avoir de mauvaises surprises…
Plus bas, il t’est possible d’activer la version payante, tu pourras par exemple afficher la bannière uniquement sur certaines pages ou articles.
Ce qu'il faut retenir
Que tu sois un expert de WordPress ou pas, cette extension est très pratique.
Même si tu sais coder et concevoir une bannière, avec ce plugin ta bannière promo sera plus rapidement conçue. Cependant, en rajoutant du code CSS, j’ai remarqué que certaines valeurs ne fonctionnent pas : sûrement pour nous pousser à prendre la version payante.
Pour quel évènement penses-tu utiliser cette bannière ? Je suis curieux de découvrir tes idées et la thématique de ton site.
Merci ! Cet article est très clair. Je suis sûre qu il me sera très utile. Je ne savais pas qu’une bannière était aussi simple à réaliser.
Merci, Muriel pour ton commentaire. Oui, ce plugin est très pratique.
Top, il faut que je n’oublie cet article lorsque je souhaiterai mettre en place une bannière publicitaire, car c’est expliqué très simplement.
Hello Marie,
Merci pour le commentaire, le blog est là pour ça, pour t’aider… Au plaisir
Hello Marc, une bonne idée ce plugin pour faire discrètement la promotion de ses événements du moment ! 😉
Hello Emy,
Oui, tu es sûr que ton public ne pourra pas rater le message. Merci pour ton commentaire 😉
Tuto génial, merci Marc ! 🌷
Dans mon cas, j’ai un bug d’affichage sans doute dû à mon « thème » wordpress (pourtant compatible ???) Je n’arrive pas à mettre la bannière en haut, j’ai essayé toutes les options (enfin je crois), cela semble être caché par ma barre de menu. En revanche cela fonctionne très bien en pied de page, j’ai donc installé la bannière ici par défaut ahah.
Hello,
Merci pour ton commentaire. Non, il n’y a pas de raison que le thème ne soit pas compatible. Quel est le thème que tu utilises ? Remets la barre en haut et essais avec ce code
z-index:999999!important;, dans Simple banner custom CSS, il s’agit du champ en carré -> (.simple-banner {).Merci pour cet article très détaillé… il tombe à pic pour un lancement prochain…
Ah ben voilà… J’espère que cela va t’aider à atteindre tes objectifs… Merci pour le commentaire 😉
Merci Marc pour cet article ! J’aime les choses simples. Je l’utiliserai pour mon lancement ! 🙂
Merci pour ton commentaire. Top…