---
title: Adding embed to your webpage
---

You can get the embed snippet, to install on your webpage, from the Embed Snippet Generator, within the app.

<Note> The snippets provided are automatically updated as per the cal.com instance. **So, even when self hosting, you can simply copy and paste the snippets from there </Note>.

There are three ways in which you can embed your cal.com link to your webpage.

<img src="//images/i1600x900-APQPQxcN1aZt_m0casf.png" alt="Embed options overview" />

## Inline

Show the embed inline anywhere on the webpage. It let's you show the embed at a particular place in your webpage.

[CodeSandbox link[React]](https://codesandbox.io/s/inline-demo-react-for-docs-xps99g?file=/src/App.js)
[CodeSandbox link[HTML]](https://codesandbox.io/s/vanillajs-week-view-inline-y9wgxc?file=/index.html)
<Frame>
<img src="/images/i1600x900-RDSMehJ8vTwZ_zcals5.png" alt="Inline embed example" />
</Frame>

## Pop-up via element click

Show the embed, on click of any element on your webpage, in a popup

[CodeSandbox link[React]](https://codesandbox.io/s/element-click-popup-h5c5v2?file=/public/index.html)
[CodeSandbox link[HTML]](https://codesandbox.io/s/popup-on-click-of-an-existing-element-framework-agnostic-forked-7pl95c?file=/index.html)

<Frame>
<img src="/images/i1600x900-IQ6S7Rq9d94T_d5vl8m.png" alt="Pop-up embed example" />
</Frame>

## Floating button pop-up

Adds a floating button that can be customized and on clicking that the embed shows up in a popup.

[CodeSandbox link[React]](https://codesandbox.io/s/floating-button-popup-react-forked-9y5g95?file=/public/index.html)
[CodeSandbox link[HTML]](https://codesandbox.io/s/embed-floating-button-popup-framework-agnostic-mg7339?file=/src/index.js)

<Frame>
<img src="//images/i1600x900-PNSh9u2m_QV2_v80gvk.png" alt="Floating button embed example" />
</Frame>

## What can you embed?

- You can embed your cal.com link for an event type e.g. `rick/get-rick-rolled`. You can get the snippet from the event-type page.
- You can embed your profile page e.g. rick. For this, you can just update the snippet to replace your cal.com event type link with your username. e.g. `rick/get-rick-rolled => rick`
- You can embed your Routing Form e.g. `forms/YOUR_FORM_ID`. You can get the snippet for that from the Routing Form page.

<Frame>
<img src="//images/i1600x900-iihnWwzsuARg_llvldw.png" alt="Routing form embed example" />
</Frame>