Séparateur

Design Shopify® : Comment ajouter un séparateur entre deux sections

Aussi appelé “Divider”, le séparateur est un trait que vous pouvez ajouter et personnaliser très facilement avec le thème SHOPIWEB. Plus épais, plus fin et de la couleur correspondante à votre charte graphique, le thème français SHOPIWEB vous permet d'ajouter et de personnaliser en quelques clics un séparateur pour désigner efficacement votre boutique e-commerce Shopify®.

PRÉ-REQUIS : Ce tutoriel est réalisé avec le thème SHOPIWEB. Pour suivre chacune des étapes, vous devez au préalable installer une licence active sur votre boutique Shopify®. Si ce n’est pas encore fait, commandez la vôtre depuis cette page.

Rendez-vous dans la personnalisation du thème SHOPIWEB

• Depuis votre tableau de bord Shopify®, cliquez sur BOUTIQUE EN LIGNE > THÈMES > PERSONNALISER

ÉTAPE 1 : Depuis le tableau de bord Shopify®, cliquez sur BOUTIQUE EN LIGNE > THÈMES > PERSONNALISER

• Une fois la nouvelle fenêtre chargée, sélectionnez la page sur laquelle vous souhaitez travailler, à l’aide du menu déroulant situé en haut au centre de l’écran

ÉTAPE 2 : Cliquez sur le menu déroulant en haut au centre de l'écran, puis sélectionnez la page de votre choix

Ajouter un bloc “Séparateur”

Le bloc “Séparateur” s’ajoute uniquement dans les sections INFORMATIONS PRODUITS et CONTENU PERSONNALISÉ.

• Choisissez la section dans laquelle ajouter un “Séparateur”, puis cliquez sur AJOUTER UN BLOC > SÉPARATEUR

ÉTAPE 3 : Pour ajouter le séparateur dans la section INFORMATIONS PRODUIT, cliquez sur AJOUTER UN BLOC > SÉPARATEUR

• Une fois le bloc ajouté, une fenêtre de personnalisation apparaîtra dans la colonne à gauche de votre écran

Personnaliser le “Séparateur”

• Réglez L’ÉPAISSEUR DE LA BARRE selon votre convenance (de 0 à 10)

ÉTAPE 4 : La fenêtre de personnalisation du bloc SÉPARATEUR apparaît dans la colonne à gauche de l'écran. Réglez facilement l'épaisseur et la taille du SÉPARATEUR

• Personnalisez la COULEUR DE LA BARRE (nous vous recommandons de sélectionner la couleur principale ou secondaire de votre charte graphique)

ÉTAPE 5 : Personnalisez la couleur du SÉPARATEUR en cliquant sur la pastille colorée

• Ensuite, les 2 curseurs suivants vous permettront d’ajuster très facilement la MARGE DU HAUT et la MARGE DU BAS

ÉTAPE 6 : Réglez les 2 curseurs suivants afin de personnaliser les marges situées en haut et en bas du SÉPARATEUR

• Les 2 derniers réglages vous permettent d’ajuster la largeur du “Séparateur” à l’aide d’un menu déroulant dans lequel vous trouverez des pré-réglages dans le but de vous simplifier la vie et de rendre harmonieux vos designs. Ces réglages se font pour ORDINATEUR et MOBILE. Une case CACHER LE BLOC peut être cochée si vous souhaitez cacher le “Séparateur” sur mobile ou ordinateur

ÉTAPE 7 : Terminez la personnalisation du SÉPARATEUR en cochant ou non les cases qui permettent d'afficher ou non le SÉPARATEUR sur ordinateur et mobile

Enregistrez et c’est terminé !

Félicitations ! Vous avez à présent amélioré le design de votre boutique Shopify® grâce aux séparateurs de sections et de contenus proposés par le thème SHOPIWEB.

Besoin d’un coup de main ?

Profitez d’un coaching personnalisé avec Xavier LOPES, le créateur du thème SHOPIWEB. Durant cet entretien privilégié, il vous apprend à devenir autonome en création de boutique e-commerce avec Shopify®. Infos et réservations disponibles sur cette page.