`ftd.iframe` accepts the below mentioned attributes as well all the [common attributes ](ftd/common/). `Note`: For `ftd.iframe`, you either need to provide `src` or `srcdoc` or `youtube`.

`src: optional string`

This attribute specifies the URL of the page which needs to be embedded within your iframe element. It takes value of type [`string`](ftd/built-in-types/#string) and is optional.

Sample code using `src`

Input

-- ftd.iframe:
src: https://www.example.com

Lang:

ftd

Output

`srcdoc: optional body`

This attribute specifies any html content which needs to be included within your iframe element.

Sample code using `srcdoc`

Input

-- ftd.iframe:
border-width.px: 4
border-color: $red-yellow
padding.px: 20

This text is coral.

Lang:

ftd

Output

`youtube: optional string`

This attribute will embed any youtube video in your iframe element. It takes value of type [`string`](ftd/built-in-types/#string) and is optional.

Sample code using `youtube`

Input

-- ftd.iframe:
youtube: 10MHfy3b3c8

Lang:

ftd

Output

`loading: optional ftd.loading`

This attribute specifies how the content inside iframe needs to be loaded. It takes value of type [`ftd.loading`](ftd/built-in-types/#ftd-loading) and is optional.

Sample code using `loading`

Input

-- ftd.iframe:
youtube: 10MHfy3b3c8
loading: lazy

Lang:

ftd

Output

Support `fastn`!

Enjoying `fastn`? Please consider giving us a star ⭐️ on [GitHub](https://github.com/fastn-stack/fastn) to show your support!

[⭐️](https://github.com/fastn-stack/fastn)

Getting Help

Have a question or need help? Visit our [GitHub Q&A discussion](https://github.com/fastn-stack/fastn/discussions/categories/q-a) to get answers and subscribe to it to stay tuned. Join our [Discord](https://discord.gg/a7eBUeutWD) channel and share your thoughts, suggestion, question etc. Connect with our [community](/community/)!

[💻️](/community/)

Found an issue?

If you find some issue, please visit our [GitHub issues](https://github.com/fastn-stack/fastn/issues) to tell us about it.

Quick links:

- [Install `fastn`](install/) - [Create `fastn` package](create-fastn-package/) - [Expander Crash Course](expander/) - [Syntax Highlighting in Sublime Text](/sublime/)

Join us

We welcome you to join our [Discord](https://discord.gg/a7eBUeutWD) community today. We are trying to create the language for human beings and we do not believe it would be possible without your support. We would love to hear from you.