Embed URL

Embed URL

In a nutshell

The Embed element renders external content such as Youtube videos and websites from a specified URL within a sized container on the portal page. You can paste the URL, set the container's dimensions, and style its surrounding appearance using the element's properties.

1. Overview

The Embed element places external content such as websites, videos, maps, dashboards, published Zoho Creator components, or any URL-accessible resource directly within the portal page. The external content fills the Embed container and renders while the surrounding container can be styled from the designer.


NotesNote: Embed is a leaf element which cannot contain other designer elements. The content loaded from the external URL is not selectable or styleable from the designer.

Ideal for:

  1. External dashboards or analytics boards
  2. Videos from YouTube, Vimeo, or other video platforms using their embed URLs
  3. Interactive maps from Google Maps or other mapping services
  4. External tools, portals, or web applications displayed inline within a portal page

2. Display properties

Property Description
Element Name The internal identifier for this Embed element. This link name is auto-generated on placing within the designer and can be customized as required.
URL The external address whose content is rendered inside the Embed container. Accepts a direct embed URL or iframe source URL.
NotesNote: Ensure the URL fieldis not left empty or the live mode of the portal page will display an empty container.
NotesNote: When the iframe of an external content is specified instead of direct embed URL, the dimensions mentioned in the iframe will be automatically be adopted into the designer.

3. Styling properties

The following properties style the Embed container, the element box surrounding the external content. They do not affect the content loaded from the URL.

  1. Layout *link*
  2. Background *link*
  3. Padding *link*
  4. Margin *link*
  5. Corner Radius *link*
  6. Border *link*
  7. Shadow *link*
  8. Opacity *link*

4. Try it yourself

Add an Embed element and try the following:

  1. Paste a YouTube embed URL and set Height to 360px and Corner Radius to 8px to add a rounded video player directly on the portal page.
  2. Set Width to Fill and Height to 480px, then paste a Google Maps embed URL to add an interactive map that spans the full page width.
  3. Apply a Border and a Corner Radius to give the Embed container a card-like appearance that matches the surrounding portal page design.

5. Points to note

  1. Only the container can be styled from the designer - The content loaded from the external URL renders as provided by its source. The container's styling wraps around the content but does not modify it.
  2. Use embed-specific URLs - Platforms such as YouTube and Google Maps provide dedicated embed URLs that differ from their standard page URLs.
  1. Configuring and managing portal pages *link*