Passer au contenu
Français
Nous Contacter
  • Il n'y a aucune suggestion car le champ de recherche est vide.

Comment remplacer un composant par un autre

Moderniser un élément sans perturber la structure de votre site hôtelier

Points clés :

  • Remplacer un composant permet de tester un nouveau design sans repartir de zéro.

  • L’opération s’effectue depuis le Designer de Webflow.

  • Vous pouvez conserver les mêmes styles et interactions.

Remplacer un composant dans Webflow est une action courante lorsque vous souhaitez moderniser votre site hôtelier, ajuster une section ou tester une nouvelle version d’un bloc existant. L’objectif est de mettre à jour le contenu ou la structure sans impacter le reste de la page.

Étapes pour remplacer un composant dans Webflow

  1. Ouvrez votre projet dans Webflow Designer
     Accédez à la page où se trouve le composant à remplacer (par exemple, un bloc “Hero”, un bouton ou une carte d’offre).

  2. Sélectionnez le composant à remplacer
     Cliquez sur l’élément dans le canevas ou utilisez le panneau Navigator pour le localiser précisément.

  3. Supprimez ou masquez le composant existant
     Si vous souhaitez le retirer complètement, appuyez sur la touche Suppr.
    💡 Astuce : vous pouvez aussi simplement le masquer (Display: None) pour le conserver en réserve le temps de tester le nouveau.

  4. Ajoutez le nouveau composant
     Depuis le panneau Add (+), faites glisser le composant souhaité (section, div, symbol ou custom block) à la même position que l’ancien.
    Vous pouvez également coller un composant déjà utilisé ailleurs dans votre projet pour garder la cohérence du design.

  5. Appliquez les styles ou classes de l’ancien composant
     Si vous voulez que le nouveau bloc garde l’apparence du précédent, copiez simplement sa classe CSS ou recréez une combo class (ex. : “Hero Section – Nouveau”).

  6. Réappliquez les interactions et animations
     Ouvrez le panneau Interactions (éclair) et rattachez les animations existantes à votre nouveau composant.

Bonnes pratiques

  • Conservez toujours une sauvegarde (backup) avant toute modification structurelle.

  • Si le composant remplacé est un Symbol, détachez-le avant suppression pour éviter d’impacter d’autres pages.

  • Vérifiez le rendu mobile et tablette avant publication : certains composants ont des comportements différents selon le device.

  • Utilisez des noms clairs et cohérents pour les nouveaux éléments afin de faciliter la maintenance par votre équipe marketing.

💡 Astuce : Pour tester plusieurs versions d’un même composant (par exemple deux versions d’un bloc “Réservation”), dupliquez d’abord la page, puis effectuez vos remplacements sur la version test.

Conclusion

Remplacer un composant sur Webflow est un moyen simple de moderniser votre site hôtelier sans repartir de zéro. En respectant une structure claire et en réutilisant les styles existants, vous gagnez du temps tout en garantissant une cohérence visuelle parfaite.