Interactions break when copied to a new page

Community resources Bugs
1

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

https://www.useloom.com/share/d3507177f293419084b6dbf94a0682a4

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: Webflow - HTML SANDBOX

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?

image
image1854×878 146 KB

It should look like this
image

7

31%20AM
31%20AM504×570 23.1 KB

Yeah. I’m afraid so

8

Set all these actions to be an initial state

37%20PM

1 Like
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!

1 Like
10

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.