Travis Bobier
 · Professional Nerd

Introduction to oEmbed and How It Works with Ceros

Embedding content from one website onto another should be quick and easy, and that's exactly what oEmbed aims to achieve. oEmbed is a simple and standardized way to embed content from one website onto another using just a URL.  It’s a widely supported method used by platforms like YouTube, Twitter, Vimeo, Ceros, and many others to make embedding content easier and more reliable. If you've ever shared a YouTube video to your Facebook feed, you've already seen oEmbed in action!

What is oEmbed?

oEmbed is a protocol that allows a website to request an embed code based on a URL. When a URL is provided, an oEmbed endpoint on the server responds with the necessary HTML code to display the content.

For example, if you wanted to embed a YouTube video on your webpage, you could copy the embed code from YouTube and paste it into your CMS page editor. However, with oEmbed, you just need the URL of the YouTube video, and the oEmbed endpoint will generate the necessary embed code automatically.

How Does oEmbed Work with Ceros?

Ceros supports oEmbed to make embedding your experiences on other websites straightforward.

Typically, to embed an experience, you would use an embed code containing some HTML elements. However, some content management platforms are restrictive and may remove or modify parts of this code, causing the content not to display correctly. This is usually done for security reasons—the administrators of your website might not want people to freely add whatever code they want to the website pages.

With oEmbed, you avoid this issue by simply providing the URL of your experience into something like a simple input field, and the embed code is pulled from Ceros automatically behind the scenes.

For example, to embed an experience, you would use the published URL, like this:

https://view.ceros.com/your-account-slug/experience-url

If the rich text editor in your CMS supports oEmbed, or you have a specific oEmbed component, it can automatically fetch the correct embed code for this URL.

Advantages of Using oEmbed with Ceros

  • No Manual Code Updates Needed: Ceros embed codes can change when you adjust layout settings, canvas dimensions, or browser scaling. Normally, you’d need to update the embed code on your site each time such changes occur. With oEmbed, the embed code is fetched fresh every time, ensuring it’s always up-to-date without needing manual updates—unless the URL itself changes.

  • Compatibility with Various CMSs: Many CMSs already support oEmbed, allowing you to embed content by simply pasting a URL.  If your CMS includes an oEmbed component, your web team just needs to ensure that ceros.com or view.ceros.com is whitelisted as an allowed domain, and you’re ready to go.

  • Widely Supported: oEmbed is used across many platforms beyond Ceros, making it a versatile tool for embedding content. If you're already familiar with embedding YouTube videos or Tweets, using oEmbed for Ceros will feel just as straightforward.

Getting Started with oEmbed in Your CMS

  1. Check Your CMS for oEmbed Support: Most modern CMSs, like WordPress or Drupal, come with oEmbed support built-in. 

  2. Whitelist Ceros: Make sure your CMS allows ceros.com or view.ceros.com as an oEmbed domain. This ensures your CMS will accept the URL of your experience.

  3. Embed Using the Ceros URL: Copy the URL of your experience and paste it into your CMS’s oEmbed component. The CMS will automatically handle the rest, fetching and displaying your content correctly.

What if your CMS does not natively support oEmbed or doesn't have a pre-built component?

If you find that your CMS does not support oEmbed out of the box, it’s not the end of the road! Your web team can likely create an oEmbed component, or there may be an existing one in your CMS's plugin marketplace or extensions library.

Using oEmbed with Ceros simplifies the process of embedding content on your website, ensuring your experiences are always up-to-date and compatible with various CMSs. It’s an easy and reliable way to integrate your Ceros content without the hassle of manual code updates or compatibility issues.

To learn more about oEmbed and how it works across different platforms, you can visit oembed.com. This site provides a comprehensive overview of the oEmbed protocol, including specifications and examples from various services that support it.

Note: For additional information about embedding Ceros on a website, please refer to our guide here.

If you have any questions regarding oEmbed, please contact our Customer Support team at [email protected]. We're here to help!