> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.teleporthq.io/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).

# How to embed code into your projects

**Find out how easy it is to embed custom HTML code into your projects. You can use this method to embed social media posts, HTML tables, animation libraries, custom JavaScript and more.**

|    |    |
| --- | --- |
| [1. Add embed container to canvas](#2-add-embed-container-to-canvas) | [2. Add code to container](#2-add-code-to-container) |

## Add embed container to canvas

To add the embed container:

* Go to the **Left panel**
* In the **Elements** tab go to the **Media section**
* Drag the **Code Embed** element into the canvas.

![Adding embed element into canvas](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/1-add-embed_f9bifh.gif)

## Add code to container

* After dropping the element, a window will open
* **Paste the code** you want to add and click **Save**.

![Adding embed code to the project](https://storage.crisp.chat/users/helpdesk/website/60c4bca58bb99c00/2-paste-embed_f1dkb0.gif)

|| JavaScript added with Code embed will only work after publishing the project.