Embedding a Klip into an HTML page

An embedded Klip is one that integrates into an external website or host application in such a way that it appears seamless to the end-user. Embeds allow you to share Klips inside and outside your organization.

You can display multiple Klips by embedding multiple control instances within a host application or you can restrict embedding of a Klip to a specific domain.

Notes:

  • To embed a Klip, you must have Embed Klip and Access Library permissions.
  • Embedded Klips automatically refresh every three hours (when a user is logged into the account). Published links can be used if you need your data sources to refresh when you're not logged in. Learn more about published links here.

This article includes:

Embedding a Klip

To embed a Klip, you must generate the embed code and copy the provided code into the body of an HTML page.

To embed a Klip:

  1. On your dashboard, locate the Klip you want to activate for embedding.
  2. At the top right of the Klip, click the 3-dot menu icon.
  3. Click Share > Embed Klip.
  4. You can use the Embed this Klip on a Web Page window to set control options.
    The options are:
    • Name: (defaults to the Klip name).
    • Description: Used to provide additional information to the user when viewing a Klip.
    • Width: Measured in pixels. For example, 320 px.
    • Theme: Light or Dark.
    • Border styles: Rounded, square corners, or none. Choose the color of the border.
    • Domain (optional): When specified, the Klip can only be viewed in this domain.

Embed Klip

Note: You can use the Preview window to see how a Klip looks and adjust the width, border style, and color appropriately.

  1. Click Next.
  2. Copy the embed code into an external web page.

Tip: Open and close the drop-down arrow, located at the bottom left of the embedded Klip, to see additional information. For example, the Klip title, description, and date and time last modified.

Managing embeds

You can view the code, delete the embed, or generate new embed code for a Klip on the About this Klip page.

To manage your embeds:

  1. In the left navigation bar, click Klips.
  2. Locate and open the Klip you want to manage.
  3. Click the Embed link.

Troubleshooting embedded Klips

This section contains information about the following:

Embedded visualization error

If the error message Embedded visualization not available appears when embedding a klip, consider the following solutions:

  • The embedded access code is accessed from your local computer, instead of a web server. For example, C:\mycomputer\embed.html. Make sure your embedded access code is coming from the web.
  • If the domain URL included http://, simply remove http:// from it.

Refresh rate for embedded Klips

Each time an embedded Klip is viewed on a web page, Klipfolio checks to see if the Klip has been rendered within the last three hours. If the Klip has been rendered within three hours, the cached Klip data is presented to the viewer. If the Klip has not been rendered within three hours, it will be rendered using the current cached data from your dashboard. You must log in to your dashboard in order for the data source cache to refresh.

Related Links

Have more questions? Submit a request