59 lines
1.6 KiB
Plaintext
59 lines
1.6 KiB
Plaintext
---
|
|
title: Embed
|
|
icon: browser
|
|
---
|
|
|
|
The Embed bubble block allows you to display a website or an iframe to your user. You can paste a video URL from many sources including YouTube, Vimeo, and mp4.
|
|
|
|
<Info>
|
|
Not all websites allow embedding. If you see a blank space, it means the
|
|
website you're trying to embed doesn't allow it.
|
|
</Info>
|
|
|
|
<Tabs>
|
|
<Tab title="Flow">
|
|
<Frame>
|
|
<img
|
|
src="/images/blocks/bubbles/embed.png"
|
|
alt="Embed bubble"
|
|
className="rounded-lg"
|
|
/>
|
|
</Frame>
|
|
</Tab>
|
|
<Tab title="Bot">
|
|
<video
|
|
controls
|
|
autoPlay
|
|
className="rounded-lg"
|
|
src="/images/blocks/bubbles/embed-chat.mp4"
|
|
></video>
|
|
</Tab>
|
|
</Tabs>
|
|
|
|
## Embed a PDF hosted on Google Drive
|
|
|
|
For this, you'll need to select the pdf file you want to embed. Right click > Preview > More actions > Open in a new window. Now click More actions > Embed item.
|
|
|
|
Copy the embed code and paste it in the Embed bubble block configuration.
|
|
|
|
## Wait for event
|
|
|
|
Enable this if you are the owner of the website you want to embed and would like to continue the bot flow only when an event from the embed is sent to the bot. This event dispatch needs to be executed in the embed website. Here is an example:
|
|
|
|
```js
|
|
window.parent.postMessage(
|
|
{ name: 'My event', data: 'Custom data passed to the typebot variable' },
|
|
'*'
|
|
)
|
|
```
|
|
|
|
You can choose the name of the event, it needs to match what you've set in the Embed bubble block configuration.
|
|
|
|
<Frame>
|
|
<img
|
|
src="/images/blocks/bubbles/embed-wait.jpg"
|
|
alt="Embed bubble"
|
|
className="rounded-lg"
|
|
/>
|
|
</Frame>
|