> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.dorik.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Iframe

# Getting Started

The Iframe element allows you to add iframe code inside it for any embedding. An inline frame (iframe) is an HTML element that **loads another HTML page within the document.** It essentially puts another webpage within the parent page. They are commonly used for advertisements, embedded videos, web analytics, and interactive content.
---

# Adding the iframe element

Follow the steps below to add an **iframe** to your site. 

* Click on the `+` button labeled **Add Element or Container** within an empty container
* From the **Elements** tab, select **Iframe**

__Refer to the GIF below:__


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/gif-recording-2024-05-12-at-21_2md5zg.gif)

---

# Editing the iframe element

Follow the steps and instructions below to add and edit an **iframe** on your site.

__The **iframe** element editor has the following options:__

* Iframe Content
* Iframe Background

__The **iframe** element editor:__

![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled_h4bzby.png)


---

## Iframe Content

In this option, you can add an Iframe Url and adjust the size (width and height) and aspect ratio of your iframe.

|| ⚠️ Remember to only paste the URL instead of the entire iframe tag


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/screen-shot-2022-09-01-at-3315_iuy9cm.png)

Refer to the list below to see the functionalities of each feature briefly: 


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-1_fxxy5s.png)


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-2_1anrrdf.png)

1. Iframe URL: Paste the URL or the embedding link into this input field, not the code; just the URL will do.
2. Width: Adjust the width of the iframe element
3. Height: Adjust the height of the iframe element
4. Aspect Ratio: Change the aspect ratio of the iframe.

---

## Iframe Background

Add a background style to your iframe by adding plain color or a gradient.


![](https://storage.crisp.chat/users/helpdesk/website/cf1fc9cc00911000/untitled-3_lna72b.png)