Tuto : Comment créer une barre de salut dans Shopify sans application

vignette
Vous voulez augmenter vos taux de conversion ? C’est ce que sont les « hello bars ».

Que vous souhaitiez ajouter des abonnés à vos courriels, annoncer des offres spéciales, diriger du trafic vers une page d’atterrissage ou faire une annonce à l’échelle du site, les barres de salut font le travail.

C’est quoi un bonjour bar ? Eh bien, c’est un bar qui repose au sommet de votre magasin Shopify, accueillant les gens lorsqu’ils arrivent sur votre page. Il vous permet d’afficher un beau message à vos visiteurs ainsi qu’un lien personnalisé.

vignette

La mise en place d’une barre de salut est facile. Suivez les étapes ci-dessous pour créer une barre de visite pour votre boutique Shopify.

À partir de votre administrateur Shopify, allez dans Boutique en ligne > Thèmes.

Trouvez le thème que vous voulez modifier, puis cliquez sur Actions > Modifier le code.
Dans la section Mise en page, cliquez sur theme.liquid pour ouvrir le fichier dans l’éditeur de code en ligne.
Trouver <body> et coller le code ci-dessous juste au-dessus.

<div id=« huratips-topbar »>
<p>Hello! This is my awesome message.<a href=« # » class=« link »>Learn More</a></p>
</div>
 

C’est le contenu du bar. Vous pouvez le personnaliser.

Cliquez sur Enregistrer.
Dans le répertoire Assets, recherchez un fichier de feuille de style (CSS) et cliquez dessus pour l’ouvrir.
En bas du fichier, collez le code suivant :

 
#huratips-topbar{
background: #19ab21;
display: inline-block;
margin-bottom: 0;
text-align: center;
width: 100%;
top: 0;
left: 0;
right: 0;
color: #fff;
}
#huratips-topbar p{
margin: 0;
padding: 5px 0;
}
#huratips-topbar a.link{
margin-left: 20px;
background: #ffd900;
padding: 5px 15px;
border-radius: 5px;
color: #000;
}
 

Cliquez sur Enregistrer.
C’est fini pour vous. En fait, vous voulez qu’il soit fixé sur la barre du haut quand vous faites défiler vers le bas. Vous pouvez vous référer à cet article pour savoir comment créer une barre fixe ou collante.

 

Poster un Commentaire

Laisser un commentaire

  S’abonner  
Notifier de