Before starting
Iframe stands for inline frame. It's a kind of "window" opening onto another site, from which it takes part of the content. In other words, an iframe is used to display content from one site to another.
With Springly, you can add iframes to the custom pages of your site. If you haven't yet, check out this article to understand all the possibilities with custom pages.
Here we will cover the following:
Where can I add an iFrame block to my page?
Access the page you wish to work on from the Website feature. Follow these steps:
- Go to Website > Menus and Pages
- Hover the cursor over the
of the page you want to rework and click on "Edit page".
- You are now on the page, in edit mode.
You can also access editing option from the showcased site if you are logged in as an administrator, just click on the "Edit page" button at the top of each page.
Adding a iFrame block to my page
Place your block on the page
To add an iFrame to your page, take the block "iFrame" and drop it on the grid of your page. Then complete with (1) the desired URL or (2) code to use.
Let's get into detail:
- If choosing (1) Webpage URL to show, the entire site will be displayed as an iframe. This is the regular link that you copy when clicking on a "share" button.
- If choosing (2) Code to use, the element displayed will be only the specific one you decided to embed. This second option is handy for adding iFrame elements from sites such as Dailymotion videos, Vimeo, etc.
You will find the code normally when clicking on an "embed" button.
Note that whenever a website provides a specific code line for embedding, this should be the option to choose for your iFrame.
Finally, if you are not able to add your iframe after trying with both options, see this article.
Customization options for your iFrame display
Several options are available on the left-hand side of your screen, allowing you to better configure the display of your iFrame and make it more interesting.
You can perform the following operations:
- Reduce or increase the height and/or width of your block
- Add a frame and choose its color and width
- Modify outer margins
- Duplicate block
- Delete block
- Choose a background
To choose a background, click on the "Background" button next to "Block", then select the desired background (solid color or image) and drag it onto the checkerboard behind your iFrame. Here's an overview:
Comments
0 comments
Article is closed for comments.