Streaming live at 10am (PST)

Interactions break when copied to a new page


#1

Hi there! My interactions break when I copy them into a new page. Problem effects symbols too. Here’s a video to explain.


#2

Please share your read-only link.


#3

I will send it to you directly. I’d prefer not to share that link here at this time


#4

Hey @DuncanHamra

I ran into same exact issue with custom order forms, sidebars, and custom header/navs!

Here is a sandbox example I just made to illistrate:
http://html-sandbox.webflow.io/ix2-multipage
Preview Designer link: https://preview.webflow.com/preview/html-sandbox?utm_source=html-sandbox&preview=e67118bc353dff859a7c3e046fc087ce

Here’s what I did to resolve this:

  1. Get a Piece of paper, it helps me a lot…

  2. Write down all related IX2 the Class and/or Combo Class Names

  3. Write down All/Child/Sibling/Parent relationship annotation

  4. Make sure that ELEMENT trigger is NOT on any of the crosspage interactions.
    image
    ! If Element is selected on any your primary trigger, it will likely break when copying it to new pages.

  5. Make sure all multipage IX2, has CLASS selected

  • This will ensure your IX2 transposes to teh correct Combo Class you assign
    image

5.B - Make sure that Class -> Sibling and/or Child is selected for all iX2 events.
5.C - Use Class -> Parent assignment for exit events

  1. Class Naming examples:
    class name: Multi Menu Toggle
    combo class name: Multi Menu Toggle–Small
    combo class name: Multi Menu Toggle–Medium
    combo class name: Multi Menu Toggle–Large

^^ in this example you’d duplicate 3 interactions to open menu.

This works in Symbols, Page Copy, and Copy Div block.

  1. To ensure maximum reliability, I use the following structure on all pages:
    -Body /// Main Page Body, configured as Flex Column
    – IX Background Wrapper /// Z=0-Column Order=1 Useful for Page Wrapper Opacity or Hide events
    – Page Wrapper /// Main Content Goes here (header, content, footer)
    – -- Header
    – -- Content Wrapper
    – -- – Hero Section
    – -- – Section
    – -- – Section
    – -- – Section
    – -- Footer
    – IX Foreground Wrapper
    – -- Lightboxes
    – -- – Sign Up/Offers LB
    – -- – Terms/Legal LB
    – -- Alerts
    – -- – Urgent
    – -- – Warnings
    – -- – Confirmations
    – -- Chat Wrapper
    – -- – Confirmations

etc…
now you can IX2 globally across whole site

image

Trobleshooting Tips:

  1. 99% of time I resolve multipage IX2 by tripple checking class names, and making sure CLASS is assigned to triggers, not element.

Other Tips:
Use Element Trigger IX2 for one off single page events.


#5

Wow! Thanks for talking the time to thoroughly explain your process. I really appreciate it.

Unfortunately, the problem continues! I can confirm that my combo classes are setup correctly, and the problem persists on very simple interactions.


#6

@DuncanHamra
Does the footer of this list (in screenshot) have Element or Class selected on the Toggle type?

It should look like this
image


#7

Yeah. I’m afraid so


#8

Set all these actions to be an initial state

37%20PM


#9

It works!

Thank you, Dram. The issue has something to do with stacking hide/show actions at 0 seconds (but not on page load). I can’t use initial state since we’re reinitializing Webflow occasionally, but it works perfectly if I move the show/hide actions after the toggle interaction… haha I have no idea why, but it works!

Thanks again!