I want to open a pop up menu from within a reusable header. However, when I go into the workflow for the element within the header, which I want to use to trigger the pop up, there isn’t an option to show the pop up!?
I’ve seen various answers to this query but I’m still struggling to understand how to do it. Thank you!
Are you trying to access an element on your page from within a reusable element? Have I got it right?
In general, a custom event is triggered on the reusable element from the page, but if the answer to my first question is yes, you have to use this plugin.
What I mean is that if you want to show the same element (pop-up, group focus etc.) on more than one page, you put this element inside the reusable element and create a custom event inside the reusable element.
Inside the reusable element, workflow tab:
Custom Event > Show Pop-Up menu
Then you can use the action “trigger a custom event from reusable element (header)” from any page where you put the reusable element.
Inside the page, workflow tab
A button is clicked > Trigger a custom event from reusable element.
Also, these two free apps will help you. Actually, these are templates, but they were created for learning and reviewing examples, not for creating apps.
Just before I go through your advice …in answer to your initial question, I want to open a pop up (menu) from within the reusuable header, on every page.
The header only contains a single logo which opens the site’s pop up menu, so I’m wondering if it might be simpler/better to do away with the header altogether and just use the logo on every page to open the pop up?
Did you put the popup inside the reusable element (header)? If you did, you can access the pop-up from the actions inside the reusable element. It will work on all pages.
Happy to help! Of course, that’s what reusable elements are for! Reusable elements are great for anything you’re going to use more than once. I believe this post will be helpful.
I really struggled to follow the instructions on that post. As a novice, it did seem a very overly-complicated procedure when all I want to do is open a menu from a link at the top of every page.
@eren seems to have nailed it by recommending simply putting the popup inside the header, and then accessing it from the actions inside the reusable element.
Yup, Eren is dead on that putting the popup inside the reusable element is the way to go if it works for your use case. I assumed (incorrectly, of course) that you needed to access a popup that wasn’t inside the reusable element, and that can be done by using a custom state. Sorry for the tangent, but maybe the custom state idea will come in handy some day.