Select the iframe component

Click on the bottom left of the plus button. In the open screen, choose the Content category. Within this category you will find the Iframe component. In the accompanying illustration, this is the upper left part.

Click on the iframe icon to add it.

Place iframe

After clicking on the Iframe icon, hover your mouse over the website. You will see an orange layer over the parts that you will come across with your mouse. Hold your mouse over the part where you want to place the iframe before or after. Now slowly move down with your mouse until the arrows in the orange layer point downwards. Then click. A loading bar appears while the iframe component is being downloaded.

Iframe added

The element is added after a few seconds. You will then see this page as an iframe on your website. In the following steps we will explain how you can have the iframe refer to the page or website of your choice.

Select the iframe

Because a different website is loaded within the iframe component, clicking on the component to select it does not work. You can still select the iframe via the parts list in the blue upper bar. Click on "Select a website part" and use the filter to search for the iframe. Then click on the item in the list to select it.

Change iFrame url

If you now click on the button for the properties of the component, you will see that you can adjust the url to which the iframe refers. Put here the url of the website that you want to show with the iframe.

Note: not all websites allow you to show them in an iframe. If a website does not allow it, the iframe window remains white.

Adjust the look and feel

If you have selected the iframe component, you can adjust the look and feel of the iframe via the layout menu on the right. For example, you can add a border to distinguish the iframe more clearly from the rest of the website. You can read more about applying borders in:

Apply borders to parts of your website

You can also specify the height and width to optimally display the website in the iframe. You can read more about setting the height and width in:

Adjust the height and width of a website part

Note: if you set the width with this, the part is not responsive anymore. A width of over 400 pixels may not shown properly on mobile devices.