Sri Shunyata on "[Plugin: Bootstrap Modals] How to Trigger a Modal Popup from a Link?"

Hi Neil,

I've got a couple of questions for you.

First off, would you be so kind as to provide a HTML example of triggering a modal from a link?

Second, I took a look at your wppeaches.com and wondering how much I could donate to inspire you to develop a fancy box modal plugin.

http://www.lets-develop.com/html5-html-css-css3-php-wordpress-jquery-javascript-photoshop-illustrator-flash-tutorial/java-script-jquery-j-query-javascript-programming/how-to-use-fancybox-a-popup-window-flexible-lightbox-shadowbox/

You see, I'm always trying to cut down on resource usage to maintain an acceptable load speed. I've implemented the fancy box modal on one of my Genesis Sites https://buysubliminal.com.

I'm using a Woocommerce Storefront Child Theme for a new site, https://magnesiumhealthcare.com

Because Woo already uses Fancybox as a default for image popups, I'm guessing that the script is already enqued. So, it should be pretty straight forward to add modal functionality through a short code.

If I wasn't so busy creating content I'd do it myself.

What do you think?

Look forward to hearing back from you!

Thanks

Shunyata

https://wordpress.org/plugins/bootstrap-modals/

Hi Neil,
Already figured out how to trigger the modal with a link. See Below.

Is there a way to target a jump link within a Modal?

<!-- Trigger the modal with a Link -->
<a href="#pg-123-modal-1" data-toggle="modal" data-target="#pg-123-modal-1"><h5>Read More</h5></a> <!-- Modal -->
<div id="pg-123-modal-1" class="modal fade" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">Modal Header</h4> </div> <div class="modal-body">
MODAL CONTENT </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div>
</div>

Thanks