🎬 Voici une vidéo qui peut t'aider : https://youtu.be/U2qwiz_6zxU

🔁 Comment utiliser la section Avant / Après dans le Story Thème ?

La section Avant / Après est parfaite pour montrer visuellement l’impact de ton produit. Grâce à un curseur interactif, le visiteur peut comparer deux images côte à côte :

✅ Idéal pour les produits beauté, transformations physiques, nettoyage, décoration, etc.

🧩 Où trouver la section Avant/ Après ?

1. Dans ton éditeur de thème Storyt, ajoute une section.
2. Sélectionne :
3. ➕ “Avant / Après”

🛠️ Quelles sont les options de personnalisation disponibles ?

1.Ajouter les images

• Image avant
• Image après
• Tu peux importer les deux depuis ta bibliothèque.

2.Hauteur de l’image

• Adaptée à l’image
• Petite / Moyenne / Grande / Très grande
• 👉 Choisis selon le format de tes images.

3.Texte et titres

• Titre (ex. : “Résultat instantané”)
• Sous-titre (ex. : “Effet grandiose”)
• Description
• Icônes (optionnelles)
• Bouton CTA (optionnel)

4.Design

• Palette de couleurs personnalisable pour adapter l’arrière-plan à ton branding.

💡 Attention à la lisibilité si tu utilises un fond foncé.

🖼️ Comment créer une image Avant / Après bien alignée ?

L’effet “Avant / Après” fonctionne bien si les deux images sont parfaitement alignées. Voici comment faire étape par étape, avec Photopea, un outil gratuit en ligne (https://www.photopea.com).

Étapes dans Photopea :

1.Crée un nouveau projet :

• Format recommandé : 1200 x 1200 px (carré

2. Importe l’image “Avant”

• Fais clic droit → Calque par copier
• Colle dans ton projet

3. Importe l’image “Après” de la même manière

• Superpose-la au même endroit
• 🔍 Baisse temporairement l’opacité pour aligner avec l’image du dessous

1. Aligne parfaitement les repères visuels (yeux, cheveux, objets…).
2. 🔄 Recadre légèrement pour que les deux images soient bien centrées et de même dimension.

💾 Exporter tes images

Tu dois enregistrer 2 images séparées :

1. Masque le calque “Après” ➤ exporte le “Avant”
2. Masque le calque “Avant” ➤ exporte le “Après”

Format conseillé : WebP (léger & rapide à charger)

💡 Nomme-les clairement : avant.webp et apres.webp.

Besoin d'aide ? N'hésite pas à nous contacter à [email protected] ! Réponse sous 48H ouvrés (donc hors week-ends et jours fériés). ⌛