Archived

This topic is now archived and is closed to further replies.

  • 0

Bootstrap Modal Not Working

Question

Posted · Report post

Hi. Bootstrap modal doesn't seem to work. I inserted this code in the widget area: [pl_modal title="Title" type="btn" colortype="info" label="Appointment Request Form"]http://speedingrabbit.com/confidentialcare/wp-admin/admin.php?page=wpcf7[/pl_modal] And it seems the actual form doesn't 'pop' out. What is wrong with it? Please check appointment request button to see what I'm talking about.

Share this post


Link to post
Share on other sites

17 answers to this question

Posted · Report post

Great. Thanks so much for sharing with the community!

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, So I can try to recreate this, which contact form plugin are you using ?

Share this post


Link to post
Share on other sites

Posted · Report post

Yup! Thanks. I think they will. Such an odd little glitch.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, I never had to do change the code like you mentioned. However, did your contact form have quite a few fields ? As when I tested, I had only: Name Email Comment

Share this post


Link to post
Share on other sites

Posted · Report post

I am using contact form 7. But the modal doesn't work even when I put just plaine text. the transparent black overlay remains across the entire screen, the modal part doesn't stand out.

Share this post


Link to post
Share on other sites

Posted · Report post

Hey. Ok. So I did the above. Please see. It's still not working!

Share this post


Link to post
Share on other sites

Posted · Report post

Leaving this open and hoping someone else will find this useful :)

Share this post


Link to post
Share on other sites

Posted · Report post

Have you put it in a widget. mine is in a widget. I did exactly what i did and the only plugin active is the contact form widget. I don't understand what's going on!

Share this post


Link to post
Share on other sites

Posted · Report post

Hey Danny. I don't know what's going on! yes. I have my own id for the contact form. the only plugin that is activated is contact form 7. Not one single other plugin is activated! ah. I wish we could find the solution!

Share this post


Link to post
Share on other sites

Posted · Report post

Ok. So I changed .modal-backdrop { position: fixed} to .modal-backdrop { position: relative} And it worked!! If anyone has the same problem this is your solution!

Share this post


Link to post
Share on other sites

Posted · Report post

what you did *

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, I just added the code above into a text widget and it worked. Are you changing the ID to the ID of your contact form ? If that still doesn't work, try disabling all non-PageLines plugins and see if this resolves your issue.

Share this post


Link to post
Share on other sites

Posted · Report post

Hey Danny. No. It only has the default fields. It's really odd. Maybe it was just a random glitch? I thought I'd share the solution in case someone else had the problem. All works well now.

Share this post


Link to post
Share on other sites

Posted · Report post

Awesome. Thanks for posting the solution.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, I have just installed Contact Form 7 and added the shortcode to the Modal shortcode. When I click the button, the form is displayed correctly in the modal window. Here is the code I used.

[pl_modal title="Title" type="btn" colortype="info" label="Click Me!"]
	[contact-form-7 id="63" title="Contact form 1"]
	[/pl_modal]

http://screencast.com/t/hnWeru9v8FIl

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there, From looking at your page in firebug, it looks as if the button has been directly linked to the contact page. In order to get the content to pop out in the modal you'll have to put the shortcode from the contact form, directly within the shortcode for the modal. The contact form on your site seems to be set up within a text widget, you won't be able to place a widget within the modal so you'll need to create a form using something like 'contact form 7' or via the new Pagelines bootsrap options (http://demo.pagelines.com/framework/tools/). [pl_modal title="Title" type="btn" colortype="info" label="Appointment Request Form!"] [contact-form1] (use the shortcode for the contact form you've created etc) [/pl_modal] I hope this helps :)

Share this post


Link to post
Share on other sites