How iframes Allow You to Embed External Content

Seamlessly Embedding Rich Content in Authoring Studio with iframes

iframes are a versatile and valuable addition to your books, allowing you to embed external content such as videos, interactive assets, or other web-based elements.

Introduction to iframes

iframes, short for "inline frames," are a useful way to enhance your books by including content from external sources. Whether you're creating educational materials, digital publications, or interactive documents, iframes offer various advantages:

1. Multimedia Integration

iframes enable you to integrate multimedia elements such as videos from Vimeo or YouTube. This makes it easy to enhance your content with visual and auditory components.

2. Interactive Assets

You can embed interactive assets created using tools like PUBNiTO's interactive builder. These assets range from quizzes and interactive videos to course presentations, allowing engagement and interactivity in your book.

3. Versatile Applications

iframes are incredibly versatile and can be used for various applications, from displaying external web content to presenting dynamic data visualizations.

Inserting iframes

Step 1: Open the iframe Window

Position your cursor where you want to embed the iframe content within your document.
Access the Insert iframe icon in the editing toolbar to open the iframe window.

Step 2: Input Your iframe Code

Inside the iframe window, you can insert the iframe code from the source of your asset, whether it is a video, interactive content, or any other web-based resource.

Step 3: Customize Width and Height

In the iframe window, adjust the width and height of the iframe to suit your layout and presentation preferences. Only the width, height, and source attributes allow customization.

Step 4: Choose Display Options

At the bottom of the iframe window, you have three display options:
Inline: Embeds the asset directly at the current cursor position in the text.

Modal: Provides the option to initially hide the asset and display an icon for it instead. This is useful for readers with limited bandwidth or when you are offering additional content.

Placeholder: Includes the asset in the document but only shows its placeholder. The actual content becomes visible when you publish the document, allowing for precise layout and content sequencing.

Step 5: Insert

After configuring the iframe settings and selecting your preferred display option, click on Insert. This embeds the iframe content according to your chosen display choice.  


1. What are iframes, and how can they enhance my books or documents?
iframes, short for "inline frames," are valuable elements that let you include content from external sources, like videos, interactive assets, or web-based elements. They offer advantages such as multimedia integration, interactive assets, and versatility in presenting dynamic data.

2. How can iframes be utilized in books or digital publications?
They offer multiple advantages:
  1. Multimedia Integration: Incorporate videos from platforms like Vimeo or YouTube to enrich content with visual and auditory components.
  2. Interactive Assets: Embed interactive elements like quizzes or interactive videos created with tools like PUBNiTO's interactive builder, enhancing engagement.
  3. Versatile Applications: Use iframes to display external web content or present dynamic data visualizations.
3. How do I insert iframes into my document?
Follow these steps:
  1. Open the iframe Window: Position your cursor where you want to embed the iframe content and click the "Insert iframe" icon in the editing toolbar.
  2. Input Your iframe Code: Within the iframe window, paste the iframe code from your asset's source (video, interactive content, etc.).
  3. Customize Width and Height: Adjust the iframe's dimensions as needed to suit your layout preferences. Only width, height, and source attributes can be customized.
  4. Choose Display Options: Select from three display options - Inline, Modal, or Placeholder - to control how the asset appears in your document.
  5. Insert: After configuring settings and selecting your preferred display option, click "Insert" to embed the iframe content according to your chosen display choice.