EverWeb Widgets HTML5

Open An iFrame
In A Modal Window

Open iframe modal window

Text Or Image Hyperlink

This widget opens an iframe in a modal window from either an image or a text hyperlink.
The modal can be used to open items like a contact form, directions map or terms & conditions to avoid sending the visitor to another page.
NOTE: The modal window is limited to a maximum of 600px wide by 600px high.
Only one of these can be used per page!

Open Modal

Widget Settings

For an image link with caption, check the box and choose the image file.
Adjust its size using the drag handles or the Metrics inspector.
Enter alt text for SEO and a caption if required.
If a box shadow is required, set the color and radius.
To style the caption...
Enter the Font Family and choose a suitable web safe fallback font.
Set the font size, color and the caption alignment.
Enter the relative or absolute file path to the page that is required to appear in the iframe.
Set the iframe dimensions and adjust the modal overlay opacity.
Note: The opacity slider can be set to maximum to completely hide the page content or set to zero to show it. A "normal" setting is 85.
For a text link, check the appropriate box and enter the pre link, link and post link text. Set the hyperlink color.
Style the text and add the iframe info the same as for an image link.

Widget Settings

iFrame Modal Widget
iFrame Modal
Get The Widget

iFrame Content

The content for the iframe can be created on a page of the site which is not included in the navigation. The general idea is outlined on the Content Blocks page.
To prevent this "content" page being indexed by the search engines, insert this code into the Head Code box in the page inspector...
<meta name="robots" content="noindex">