Streaming live at 10am (PST)

Webflow Interactions 2.0 pop-up modal


#1

Hi,
I am attempting to put a pop-up modal into my website by following “How to build a pop-up modal in Webflow” blog, but am a bit stuck.

I thought I followed the instructions exactly (outside of the design), but when when I click the ‘sign up’ button, I am not getting an interaction. I went back a recreated all the steps a couple times, but get the same result.

Any guidance as to what I am doing wrong would be greatly appreciated.

Thanks

https://preview.webflow.com/preview/the-veterans-team?preview=a9efdbe1595571fec0482cb937aabcb6


#2

Okay which page and section, then which button has the popup interaction on it.


#3

Homepage and the ‘Slider’ section (directly below the header). The interaction should be on the button that says ‘Sign up’


#4

There’s no trigger set on that button in the interactions panel.


#5

Well, that probably explains why it’s not working then…

Here are some screenshots I am seeing from my end. I believe I have the interaction setup on the button. Are you able to see what I am doing wrong?


#6

Oh so you’re talking about the Submit button in the Modal - and - not the Sign up button on the homepage?


#7

No.

The last screenshot is a little deceiving. If you look closely, you can see it lines up with the ‘sign up’ button behind the modal.


#8

Right, okay I gotcha. I just Display: None on that layer to work with the Sign up button. But I get it now. Yes on the Sign up button, when you add the interaction to show the modal, what happens?


#9

As of now, nothing.

It appears as a ‘button’ that is not connected to anything.

When clicked, nothing happens


#11

disregard that last comment. It’s saving


#12

Okay, I’m making baby steps.

I removed the interactions from the ‘modal wrapper’ div and added them to the ‘body.’

Now, when the ‘sign up’ button is clicked, the sign up form will flash on the screen, then immediately hide again.


#13

Okay save that and let me go into your site and look, because I would put an interaction on the body, but I’ll see it after you save. I get it working and put the screencase video on it so you can see it here.

Here ya go. Let me know if this is what you wanted:


#14

Thank you Thank you Thank you!!!

IOU a beer Gary.

https://preview.webflow.com/preview/the-veterans-team?preview=c1c3f229aac31b507aed4605466e0183


#15

Hey Gary,

I played around with it for awhile and got it figured out.

For anyone else having trouble with this, here was my solution:

On the body I put the ‘show sign up form’ trigger
On the ‘Modal Wrapper’ div, I put both the 'close modal trigger and ‘close modal form’ triggers
And, on the ‘Sign up Button,’ I put the ‘open sign up form’ trigger.

I appreciate your help nonetheless Gary. You def helped steer me the right direction.


#16

Awesome! Very happy you got it worked out. Have fun.