Comment dupliquer un composant pour créer une version différente

Points clés :

• Dupliquer un composant permet de tester des variantes sans altérer l’original.
  
  
• La duplication se fait directement depuis le Designer de Webflow.
  
  
• Vous pouvez ensuite personnaliser la nouvelle version indépendamment.
  
  

Dupliquer un composant dans Webflow est une excellente méthode pour créer une nouvelle version d’un bloc, d’un bouton ou d’une section sans risquer de modifier l’original. C’est particulièrement utile lorsque vous souhaitez tester un nouveau design, un texte différent ou une disposition alternative pour votre site hôtelier.

Étapes pour dupliquer un composant dans Webflow

1. Ouvrez votre projet dans Webflow Designer
   Accédez à la page contenant le composant que vous souhaitez dupliquer.
   
   
2. Sélectionnez le composant
   Cliquez sur le bloc, la section ou le bouton que vous souhaitez copier.
   
   
3. Dupliquez le composant
   Faites un clic droit sur l’élément et sélectionnez Duplicate, ou utilisez le raccourci Cmd/Ctrl + D. Une copie exacte apparaîtra juste en dessous.
   
   
4. Renommez votre nouveau composant
   Pour éviter toute confusion, donnez un nom clair à la nouvelle version (par exemple “Hero Section – Variante B”).
   
   
5. Personnalisez la nouvelle version
   Modifiez le texte, les images ou les styles sans affecter le composant original. Si vous travaillez avec des Symbols (Composants globaux), pensez à détacher l’instance avant de modifier (clic droit > Unlink from Symbol).
   
   

💡 Astuce : Si vous souhaitez garder la logique de style commune mais changer certains détails, préférez créer une classe combo plutôt que de tout modifier. Cela vous permettra d’expérimenter tout en maintenant la cohérence graphique du site.

Bonnes pratiques

• Dupliquez toujours dans une page de test avant d’ajouter la nouvelle version sur une page publique.
  
  
• Renommez systématiquement vos classes et composants pour faciliter la maintenance.
  
  
• Conservez un historique des versions via le panneau “Backups” pour revenir en arrière si nécessaire.
  
  

Conclusion

Dupliquer un composant dans Webflow est une solution simple et puissante pour créer des variantes de design sur votre site hôtelier. Cette méthode vous permet d’expérimenter sans risque et d’améliorer l’expérience utilisateur tout en maintenant une structure claire et professionnelle.