Modal Windows

Your Higher Logic site already uses modal windows (in the admin) to conveniently display content in an overlay without taking you off the current page. This hack shows you how to add your own modal windows that load content in your custom pages.

The modal window html

Copy the html below into a HTML widget on your page. Keep this widget as the topmost widget on your page, or add to your site wide include that loads 'Above Content.' You can customize this code with extra classes or html as needed.

The boostrap connector (javscript)

Add this link to a js file at the bottom of your page. Once you've confirmed this is working, you can move it to a site-wide include that loads below the page content. This will let you use the script across your whole site, instead of just on this page.

Finally, the link that calls the modal window. Remember to remove the href="" if it exists in your <a> element.

Complete and Continue