Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress From Bootstrap to WordPress Add Bootstrap Components to WordPress Theme How to Add Bootstrap Modal Windows to Your WordPress Theme

Posted by Sergio Fonseca
Sergio Fonseca
10,841 Points

Modal Window Disappering

Hi guys,

When I try to open a modal window, as it starts to fade in, it will almost immediately go up again and disappear. I've been looking online and the solution that I found is to remove bootstrap-modal.js but this isn't being called up anywhere.

Any ideas to solve this?

Cheers

9 Answers

Justin Tiews
Justin Tiews
8,652 Points
Justin Tiews
Justin Tiews
8,652 Points

Sergio,

This happened to me. From what I found through Google it was because bootstrap js was being called twice. When I viewed source I found that the bootstrap shortcode plugin was calling the bootstrap js so i disabled it.

This at least solved the modal issue. So far it does not seem to have broken anything else. Fingers crossed.

Justin

Kevin Brown
Kevin Brown
2,312 Points
Kevin Brown
Kevin Brown
2,312 Points

Thank you, Justin! I went into the WP admin/Settings/BS Shortcodes, and deselected "Load Twitter Bootstrap javascript file" and that did the trick.

Victor Camara
Victor Camara
2,417 Points
Victor Camara
Victor Camara
2,417 Points

This fixed it for me also Kevin, thanks!!

Craig Watson
Craig Watson
27,930 Points

This seemed to do the trick for me to :)

ammarkhan
.a{fill-rule:evenodd;}techdegree
ammarkhan
Front End Web Development Techdegree Student 21,661 Points

Kevin Brown Thanks for the trick. It helped!

Justin Tiews
Justin Tiews
8,652 Points
Justin Tiews
Justin Tiews
8,652 Points

Just noticed there is actually a setting inside Bootstrap shortcode plugin that allows you to not load the bootstrap js.

Sergio Fonseca
Sergio Fonseca
10,841 Points
Sergio Fonseca
Sergio Fonseca
10,841 Points

Hi Justin,

Thank you for your contribution. I managed to get the modal window working now.

Bob Sutherton
Bob Sutherton
20,160 Points
Bob Sutherton
Bob Sutherton
20,160 Points

I had an issue where I had to remove the extra CSS but not the extra JS. Hmmm?

Selina Meghji
PLUS
Selina Meghji
Courses Plus Student 260 Points
Selina Meghji
Selina Meghji
Courses Plus Student 260 Points

I also had to deselect in BS Shortcodes, the css

garsan
garsan
2,592 Points
garsan
garsan
2,592 Points

Thank you, Justin! Very helpfull!

Patrick Koch
Patrick Koch
40,496 Points
Patrick Koch
Patrick Koch
40,496 Points

thanks, helped me too

g patrick

Sean McIntosh
Sean McIntosh
18,966 Points
Sean McIntosh
Sean McIntosh
18,966 Points

I have been developing a WP site for a client and was stuck with this problem alongside the carousel's slide function not working... who would've thought BS Shortcodes would auto include the bootstrap .js and .css?

Thanks :)