Éditeur de contenu

Inhaltsverzeichnis

Introduction

Avec l'éditeur de contenu, vous créez en un tour de main des pages de contenu uniques pour votre boutique en ligne. Dans ce guide, nous vous expliquons pas à pas l'éditeur de contenu et, en dernier lieu, l’affectation de la page créée dans le menu.

Créer une page

Dans l’administration de la boutique, sous Contenu -> Pages, vous pouvez créer une nouvelle page ou modifier une page existante.

Illustration 1 : Pages

Interface de l'éditeur de contenu

Vous vous trouvez maintenant dans l’interface de l'éditeur de contenu.

Illustration 2 : Editeur de contenu

Fonctions Explication
Responsive Design (1) Modifier l’affichage pour voir à quoi ressemble votre site pour les appareils mobiles. Vous ne pouvez toutefois modifier les affichages que partiellement et indépendamment. Par exemple, vous pouvez modifier la taille d’une image dans l’affichage mobile, mais l’ancienne taille est toujours affichée dans l’affichage desktop. Mais vous ne pouvez pas adapter la position de l’image par vue.
Lien (2) En cliquant sur le crayon, vous pouvez adapter le lien de la page. Si vous cliquez directement sur le lien, vous accédez à la page de la boutique en ligne.
Undo/Redo (3) Avec ces flèches, vous avez l’option d’annuler ou de revenir sur les dernières opérations.
Afficher les lignes d’aide (4) Les lignes d’aide vous aident à vous orienter.
Aperçu (5) Dans l’aperçu, vous pouvez voir votre page (y compris les modifications non encore enregistrées) du point de vue du client.
Publier (6) La page que vous avez créée est automatiquement enregistrée. Lorsque vous êtes prêt, vous pouvez publier la page ici.

Éléments

Sur le côté droit, vous trouverez les éléments qui peuvent être placés facilement par glisser-déposer. Il y a trois éléments.

Modèles

Les modèles sont des éléments déjà prêts, avec image et texte, qui servent d’inspiration.

Illustration 3 : Modèles

Mises en page

Les mises en page vous donnent une structure générale.

Illustration 4 : Layouts

Contenus

Vous pouvez faire glisser les contenus directement dans les mises en page ou dans les modèles. Il y a un contenu pour chaque bouton, image, titre, texte et vidéo.

Créez donc d’abord votre structure à partir des modèles ou des mises en page et remplissez-la ensuite avec les contenus.

Illustration 5 : Contenu

Paramètres de l'élément

En cliquant sur un élément, les paramètres de l'élément s’ouvrent à droite. Selon l’endroit où l’on clique, d’autres options s’ouvrent. Dans les réglages de l'élément, vous pouvez définir la largeur de la boîte, adapter l’arrière-plan ou déterminer l’alignement.

Boîte / Mise en page

Vous pouvez définir l’arrière-plan de chaque boîte. Pour cela, il suffit de cliquer sur l’arrière-plan. Les paramètres des éléments s’ouvrent alors à droite. En plus d’un arrière-plan transparent, vous avez la possibilité de choisir une image, une vidéo ou une couleur.

Illustration 6 : Boîte/Layout

Vous pouvez également effectuer des réglages pour la plus petite boîte (layout). Cliquez sur l’arrière-plan de la mise en page, vous pouvez alors procéder aux réglages suivants.

Illustration 7: Mise en page

Formater les titres

La structure des titres n’est pas seulement importante pour l’apparence, mais aussi pour l’optimisation des moteurs de recherche (SEO).

Veillez à ce qu’il n’y ait qu’un seul titre H1 (titre 1) par page !

Vous pouvez régler les titres au niveau de la taille de la police :

Illustration 8: Taille de la police

Bouton

Lorsque vous cliquez sur le bouton, vous disposez également de diverses possibilités de réglage. Définissez ici la destination du bouton, sa taille, son arrière-plan, etc.

Illustration 9: Bouton

Image / Vidéo

Cliquez sur l’image ou sur la vidéo, ici aussi le masque d'édition s’ouvre à droite. Téléchargez l’image souhaitée en cliquant sur l’icône de l’image.

Illustration 10: Image

Le gestionnaire d’actifs s’ouvre maintenant. A l’aide de cet assistant, vous pouvez télécharger les images ou les sélectionner directement à partir des images de produits.

Illustration 11: Asset

Cliquez sur l'élément vidéo pour modifier les paramètres suivants. Vous pouvez télécharger des vidéos depuis Youtube ou Vimeo. Insérez en dessous le lien vers la vidéo ou l’ID de la vidéo.

Illustration 12: Vidéo

Édition rapide

En plus des paramètres des éléments, vous pouvez aussi éditer les contenus directement sur la boîte. En cliquant sur le contenu souhaité, vous pouvez déplacer, dupliquer ou supprimer la boîte. Vous pouvez également adapter le format du texte directement ici.

Illustration 13: Adapter le titre

Affecter le menu

Dès que vous avez terminé la page, vous pouvez maintenant l’attribuer à un menu. Sous Contenu -> Menu, vous trouverez la page nouvellement créée sous “Pages récentes”. Vous pouvez maintenant sélectionner la page, choisir le menu souhaité dans le menu déroulant et ajouter la page.

Illustration 14: Menu

Vous attribuez les pages fixes comme les CGV, la page d’accueil, etc. directement dans leur édition. Allez sous Contenu -> Pages et éditez par exemple les CGV.

Nouveautés à partir de la v10

À partir de la version 10 de PepperShop, il y a diverses nouveautés dans l'éditeur de contenu. Les fonctions avancées de l'éditeur de contenu vous aident à créer facilement et rapidement des contenus utiles et des expériences de marque personnalisées.

Outre le gestionnaire d’actifs élargi avec des images de prdoukte ainsi que des icônes de paiement et de logistique, dans lequel il est désormais possible de télécharger le format d’image Webp, des vidéos Loon, des GIF animés, par exemple pour les cinemagraphs, il y a quelques nouvelles fonctionnalités fantastiques :

Faire voler les textes et les images

Vous pouvez maintenant ajouter des effets à vos textes et images.

Sélectionnez le texte souhaité et ouvrez les “Paramètres d’effet”. Définissez tout simplement de quel côté (en haut, en bas, à gauche, à droite) l'élément doit être affiché.

Intégrer son propre code

Les codes source HTML et JS sont désormais directement intégrés dans l'éditeur de contenu. L’intégration se fait via un nouvel élément de contenu.

Celui-ci est simplement glissé sur la page de l'éditeur de contenu. Il est ainsi possible d’intégrer par exemple des extraits de Google Maps, des évaluations Google, des flux de médias sociaux ou des catalogues.

Selon le widget à intégrer, le fournisseur tiers propose immédiatement un code d’intégration à copier ou vous pouvez créer un code de widget avec un configurateur de widgets.

Petite astuce : avec “elfsight”, vous pouvez facilement générer des codes de widget, comme par exemple Social Feed.

https://go.elfsight.io/click?pid=828&offer_id=3&l=1677843061

Page de “remerciements chaleureux

Vous souhaitez attirer l’attention de vos clients sur quelque chose ou leur faire part de quelque chose après l’achat ?

La page de fin de commande du processus de commande est désormais une page standard et peut être facilement configurée selon vos souhaits dans l'éditeur de contenu. Y compris l’intégration d'éléments dynamiques via “intégrer son propre code”, ce qui offre de toutes nouvelles possibilités.

Le footer, le bas de la page de votre boutique en ligne, est également une page standard pour les boutiques PepperShop nouvellement installées, qui peut être éditée dans l'éditeur de contenu. Le nouveau pied de page est conçu de manière simple et claire afin de rendre la navigation plus conviviale.

Si vous mettez à jour une boutique existante, le pied de page est bien entendu conservé et n’est pas écrasé.

🌶️
🔥
🌶️