The Embedded Objects tool makes it a breeze to add YouTube videos, maps, lead forms, social feeds, playlists, and tons of other third-party content directly to your Ceros Experiences. Below we’ve outlined the basic steps to get 3rd-party content into Ceros.
How to Add Embedded Objects
- Navigate to the web object you would like to embed and copy the HTML embed code provided (usually found within the share menu)
- In the Ceros studio, select the Embed Objects icon and draw a placeholder on your canvas
- With that Embed Object window selected, you’ll see a box in the Design tab of your Inspector Panel where you can paste in an embed code
It’s that simple! Below we have outlined a handful of different use cases, however, the limits are really based on your creativity and access to web-based embed codes.
YouTube
Embedded YouTube videos are a great way to preserve the views and shares reflected on the YouTube platform. To embed a YouTube video within Ceros:
- Locate the Share button below the YouTube video
- Select Embed and copy the provided embed code
- Navigate to the Studio and select the Embed Object icon
- Draw out a placeholder box on the canvas
- Paste the YouTube embed code into the Inspector Panel
You can customize your YouTube embeds by adding the following parameters to the end of the URL in the embed code:
?modestbranding=1&enablejsapi=1&autoplay=1&controls=0
- modestbranding=1 – this will remove some YouTube branding (this should be first)
- autoplay=1 – the video will play automatically
- controls=0 – this will remove all controls except for the play/pause button in the center of the video
An embed code example:
<iframe width=“560” height=“315” src=“https://www.youtube.com/embed/exampleAddParametersHere” frameborder=“0” allow=“accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture” allowfullscreen></iframe>
For more information regarding supported YouTube player parameters, please refer to this article via Google.
Google Map
- Locate the map you would like to include in your Ceros Experience
- Click the Share button and then select Embed map
- Select the size you would like to use (this can be changed later) and copy the provided code
- Draw out a placeholder box on the canvas
- Paste the Google Maps embed code into the Inspector Panel
Note: The embed code width and height dimensions will override the placeholder box you draw. If you would like the google map to take the shape of your embedded object box, change the width and height to 100%.
Social Feeds
- Navigate to the social post or feed you want to share
- Locate and copy the embed object code
- Navigate to the Studio and select the Embed Object icon
- Draw out a placeholder box on the canvas
- Paste social feed embed code into the Inspector Panel
Lead Forms
Embedding lead forms directly into Ceros is a great way to customize your user’s experience to better fit your company’s needs. How to export will likely vary depending on the lead form provider. Please consult your CMS documentation to determine how to embed lead form objects.
Note: Depending on the embed code provided, you may need to adjust the dimension of either the placeholder box or the HTML code provided.