Streaming live at 10am (PST)

Help! How can I add the option to close our pop up form?

Here is my site Read-Only: LINK

People are getting very frustrated that when they submit the Mailing List pop up form (bottom right of page), or don’t want to submit the form, they can’t close the form. I can’t seem to figure out how to add an exit option to the form! Any help would be greatly appreciated! Thanks in advance!

Hi Josh,

you could add an element for closing and use it as a trigger to build an interaction which changes the whole pop up container to display:hidden when clicked (via Hide/Show interaction).

I think you could bind that very same interaction with the submit button aswell, to hide it immediately after applying to the mailing list. You should do some testing on that one though.

Let me know if you need any further assistance.

Hey Chris! Thanks for getting back to me.

Would you be able to provide some instructions on how to add an element for closing it?

Josh

Sure!

This is what I did for a real fast and sloppy solution:

  1. Add a div block to your “Pop_up_Contain” Symbol
  2. Position this div block absolute:topright:

grafik

And change the cursor to pointer for that div while you’re at it (so users see that they can click):

grafik

  1. Add a text element and some text and place it in the new div (e.g. “close”, “x” whatever, you could add an icon instead of a text element too):

grafik

  1. Select your new div block containing your text or whatever element you’ve chosen and add an interaction. Your element trigger needs to be “Mouse click (tap)”. Add a new interaction and select your “Pop_up_Contain” Symbol. Add a new action for your interaction (“Hide/Show”) and set the Hide/Show to Display:hidden

grafik

Now users are able to close your popup by clicking on the div.

In theory, you could add the same interaction to your “submit button”. I’ve tried that as well but it results in the popup disappearing immediately after pressing submit (no success message is shown and it disappears when there have been errors too). So that’s not going to be a good user experience. Unfortunately, I’ve never used forms so far and don’t know much about how they function. Hopefully, someone else is able to jump in here to help.