This topic has 14 replies, 3 voices, and was last updated 9 years by 
-
-
COPY CODE
<!-- Button trigger modal --> <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> Launch demo modal </button> <!-- Modal --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="myModalLabel">Modal title</h4> </div> <div class="modal-body"> ... </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div>This should render fine… can we not use normal bootstrap markup to render basic bootstrap items?
Hello, the video modal shows fine, i dont see any kind of error, could you explain a bit more? Thanks 🙂
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionLaura Solanes - Graphic Designer and Web Designer
Please be patient as I try to answer each topic as fast as i can.
If you like the theme or the support you've received please consider leaving us a review on Themeforest!
Always happy to help you 🙂
@Laura really?! lol! It shows fine because its not Kleo. The ShoeStrap. The example is what I want to achieve
Can you provide me a working version of this in Kleo?
Hello, this can be done with Easy Modal Plugin https://wordpress.org/plugins/easy-modal/
Let me know if it helps 🙂Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionLaura Solanes - Graphic Designer and Web Designer
Please be patient as I try to answer each topic as fast as i can.
If you like the theme or the support you've received please consider leaving us a review on Themeforest!
Always happy to help you 🙂
@Laura… thank you for answering, however I certainly don’t want to load yet another javascript file/s and css/s via a plugin to further bloat the theme out even more. Bootstrap is already loaded in this theme….
The modals need fixing. @abe can you advise here. This really should be working and no offence meant but it feels like this issue is being swept under the rug. There’s other users not getting answers on this
Works for me. Just needed to adjust the css
COPY CODE#myModal { top: 0 !important; } #myModal:focus { outline: none; }Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
Not here. This should work out of the box, can I request to get this working for the next update? Adding css should be needed
I used raw html element from visual composer and place this snippet
`
<!– Button trigger modal –>
<button type=”button” class=”btn btn-primary btn-lg” data-toggle=”modal” data-target=”#myModal”>
Launch demo modal
</button><!– Modal –>
<div class=”modal fade” id=”myModal” tabindex=”-1″ role=”dialog” aria-labelledby=”myModalLabel” aria-hidden=”true”>
<div class=”modal-dialog”>
<div class=”modal-content”>
<div class=”modal-header”>
<button type=”button” class=”close” data-dismiss=”modal” aria-label=”Close”><span aria-hidden=”true”>×</span></button>
<h4 class=”modal-title” id=”myModalLabel”>Modal title</h4>
</div>
<div class=”modal-body”>
…
</div>
<div class=”modal-footer”>
<button type=”button” class=”btn btn-default” data-dismiss=”modal”>Close</button>
<button type=”button” class=”btn btn-primary”>Save changes</button>
</div>
</div>
</div>
</div>
`# things wrong
1. Modals should always load in the horizontal center on the browser regardless of page template used.
2. Modals should load near the top of the page – not pushed down
3. If the page is short it should not be obscured by the footer
4. We should not have to added css manually to the theme just to make it render at alladd position:fixed to #myModal
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
COPY CODE*/ #myModal { top: 20px !important; position: fixed; } #myModal:focus { outline: none; }Is a huge help! it’s getting there, again this should be placed in the theme natively
Also when when you guys catch up to bootstrap 3.3.4 – you’re still on 3.0 and some markup is broken
You’re welcome.
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
regarding?:
Also when when you guys catch up to bootstrap 3.3.4 – you’re still on 3.0 and some markup is broken
I dont know. I was just trying to help you get your modals working. I’m a kleo user like you that has moderator status because I’m amazing. 😀
Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solutionThis support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com
The forum ‘General questions’ is closed to new topics and replies.
