How do I hide sections in "Display" on duplicated pages from a parent Webflow template/layout without affecting other pages?

To hide sections on duplicated pages in Webflow without affecting the original template or other pages, you need to use page-specific classes or customize visibility only on the desired page.

1. Duplicate the Page Correctly

• Use the “Duplicate” function in the Pages panel to create a copy of the desired page.
• This ensures the page layout and elements are preserved, but allows for independent customization.

2. Select the Section to Hide

• On the duplicated page, click the section you want to hide.
• Ensure you’re on the duplicated page and not the original.

3. Detach Shared Classes (If Needed)

• If the section shares a global class (e.g., hero-section), changes will affect all pages using that class.
• To avoid this:
• Add a combo class (e.g., hero-section hidden-version) or create a new class (e.g., hero-section-copy).
• This makes the section’s styles unique to that page.

4. Hide the Section via Display Settings

• With the section selected, go to the Style panel.
• Under Layout > Display, set the value to None.
• This hides the section on this page only, as long as it has a unique class or combo class.

5. Double-Check Other Pages

• Preview other pages that use similar layouts to ensure the hidden setting has not affected them.
• If so, check that those sections still use the original class (without the modified combo or new class).

Summary

To hide a section on a duplicated Webflow page without impacting other pages, assign a unique class or combo class to the section and set its Display to None. This localizes the change, preserving the layout across your entire site.