iFraming is a way of adding content from another website to your webpage. There are a few situations where you'd want to use an iframe but the most common uses are adding videos or interactive maps. The following steps will show you some of the different ways you can add content with iframe on MoxiWebsites.
Adding iframe Content to a Custom Page
Adding iframe Content to a Custom Page Builder Page
TIP: When using iframe, the source webpage must have the same Hypertext Transfer Protocol (HTTP) as your website. If you have applied the SSL cert to your website, you'll want to make sure that the source webpage you are sharing onto your site has HTTPS protocol. Additionally, some websites have blocked the ability to embed their content through iframe and you will not be able to share that content on your webpage.
Adding iframe Content to a Custom Page
Select Site Pages from the left-hand navigation. And then select Add New.
Choose Custom Page from the drop-down menu, then select Submit.
Give your page a name and Save Draft.
Next, select View>Source and then copy & paste the following code (code below image).
<p><iframe style="border: 0px #ffffff none;" src="https://moxiworks.com/" name="moxiSupportiFrame" width="100%" height="1080px" frameborder="1" marginwidth="0px" marginheight="0px" scrolling="yes" allowfullscreen="allowfullscreen"></iframe></p>
Replace the part above in yellow with the URL you want to share. Replace the parts in green with the sizing that fits best for your website. In this example, the shared content will display at 100% of the available width of your webpage and will adjust for the size of the screen it's being viewed from. There is also a scrollbar and the display of the content is 1080 pixels tall. Adjust this to fit your desired effect.
TIP: The preview in the main Visual area will look small so be sure to select the Preview button on the right to see exactly what the iframe will look like.
NOTE: If the page you are trying to iframe has a different HTTP/HTTPS protocol or a setting that doesn't allow iFrame embedding, you will see an error in your preview.
Select Publish to save your page.
Adding iframe Content to a Custom Page Builder Page
Select Site Pages from the left-hand navigation. And then select Add New.
Choose Custom Page from the drop-down menu, then select Submit.
Give your page a name and Save Draft.
Select the Page Builder tab to load the Page Builder editor.
Select the Modules tab.
Then drag and drop the HTML module where you want it to be on your page.
TIP: This can be a full page iframe or a portion of a page (example: Sharing a full webpage or sharing an interactive map).
Copy & paste the following code (code below image).
<p><iframe style="border: 0px #ffffff none;" src="https://moxiworks.com/" name="moxiSupportiFrame" width="100%" height="1080px" frameborder="1" marginwidth="0px" marginheight="0px" scrolling="yes" allowfullscreen="allowfullscreen"></iframe></p>
Replace the part above in yellow with the URL you want to share. Replace the parts in green with the sizing that fits best for your website. In this example, the shared content will display at 100% of the available width of your webpage and will adjust for the size of the screen it's being viewed from. There is also a scrollbar and the display of the content is 1080 pixels tall. Adjust this to fit your desired effect.
NOTE: If the page you are trying to iframe has a different HTTP/HTTPS protocol or a setting that doesn't allow iFrame embedding, you will see an error in your preview.
Select Done then Publish, or Save Draft to come back and work on this page more later before making it public.