Skip to content
English - United States
Nous Contacter
  • There are no suggestions because the search field is empty.

I would like to change a block on all pages, how do I do that?

Save time with Webflow's reusable symbols and components

Key points:

  • Use symbols (or components) to modify a block globally.
  • Apply the changes only once to all pages.
  • Maintain consistency in design and content across the hotel website.

On a hotel website built with Webflow, it's common to have recurring blocks—like the footer, header, contact banner, or "Book Now" button. Rather than modifying them individually, Webflow allows you to transform these blocks into global elements (called symbols or components). Here's how to use them effectively to save time and maintain a consistent website.

1. Identify the block to modify

Determine which element needs to be updated on all pages:

  • Navigation bar (menu, logo, "Book" button).
  • Footer (contact information, legal notices).
  • Call-to-action banner (special offer, booking link). 💡 Tip: Ensure the block structure is identical on every page before converting it to a symbol.

2. Transform the block into a global symbol

In Webflow Designer:

  1. Select the block you want to reuse (for example, the footer).
  2. Right-click and then click on “Create Component” (formerly “Create Symbol”).
  3. Name it clearly (e.g., “Global Header” or “Hotel Footer”). This block then becomes a global element: any changes you make to it will automatically be applied to all pages where it is used.

3. Modify the global block

To update this component:

  • Double-click on it in the Designer.
  • Make your changes (text, link, image, button, etc.).
  • Save. All pages containing this symbol will update instantly. 💡 Tip: If you only want to change one detail on a single page (for example, a different link), you can detach the symbol using “Unlink from Component”.

4. Add the component to other pages

  • Open another page in the Designer.
  • From the Add (A) → Components panel, drag your global block to the desired location.
  • The content remains synchronized with all other pages.

5. Check the responsive rendering

As with any global element, ensure that the block remains responsive:

  • Test on Tablet, Mobile Landscape, and Mobile Portrait views.
  • If you adjust the layout, these changes will also be propagated automatically.

Best practices for hotel websites

  • Create a global header with a "Book Now" button that is always visible.
  • Use a consistent footer (address, phone number, Google Maps link).
  • Group recurring elements into a "Components" folder to simplify project management.

Conclusion

With Webflow symbols and components, you can modify a block once and apply the update across your entire hotel website. It's a powerful way to ensure brand consistency, save time, and effortlessly keep your site up-to-date.