Archived topic
Bootstrap modal in header issue
7 replies · Started by Alberto on October 6, 2020
Hello
I'm trying to use a Bootstrap's modal in my header via a Hook in Elements.
My website is: https://pruebas.arenatours.com
First I need to get the modal working: for any reason it doesn't work (no errors displayed, no modal opened). And second, I need the div where the button is placed, to be in the sticky navigation, i.e., I want it to get fixed, as you can see it now before scrolling (you can see what I try in https://arenatours.com)
Could you give me a hand, please?
Thanks in advance
Hi there,
The website you've linked (https://pruebas.arenatours.com/) isn't loading for me. Can you double check?
First I need to get the modal working: for any reason it doesn’t work (no errors displayed, no modal opened).
This doesn't sound like a theme related issue so you will need to do a little debugging to try to find the problem.
And second, I need the div where the button is placed, to be in the sticky navigation
Can you fix the URL issue above so I can see the current layout?
Hi Leo
Sorry, the right URL is https://prueba.arenatours.com
Regards
Hi there,
what is the trigger button for the modal?
As a word of advice, i would probably look for a non boostrap modal - boostrap loads around 8000 lines of CSS, some of the selectors it uses are very generic and can conflict with the themes CSS. And thats a lot of CSS if its only being used for a modal. Maybe the Popup make plugin would be a better option.
Hi, David
Thanks for replying!
The button for the modal is "Descubre sus ventajas". I need to use Bootstrap not only for that modal,but I appreciate your suggest.
Also, I need this kind of top-bar to be fixed as the sticky navigation, just like in https://arenatours.com
Regards
Does the modal work outside of the element like in a regular page content?
Hi,Leo.
Yes it is.
Is just like in https://arenatours.com
Regards
The markup for the button between the two sites are different:
https://www.screencast.com/t/3kV9oNOKWUtt
https://www.screencast.com/t/1GACpsJj
Can you create a new page, insert this one:
https://www.screencast.com/t/3kV9oNOKWUtt
And link us to it?
