Skip to main content

Search

Hi. How can we help?

Embedded Webpages

  • Updated

How to Develop and Embed Webpages

The following guidance outlines prerequisites and best practices for creating web pages that are intended to be embedded as layers in LiveU Studio.

1. Transparent Background

 When developing your embedded HTML page, ensure that the background is transparent. Do not use a chroma key (e.g., green alpha channel). Instead, enable true CSS transparency. Add one of the following:

 {
    background-color:rgba(0,0,0,0);
}

or define it inline:

<body style="background-color:rgba(0,0,0,0);">

2. Interaction and Storage Constraints 

Embedded pages in Studio are treated as server-side browser renderings. Therefore: User interactions (clicks, keyboard input, navigation) are not supported within the embed. Local storage mechanisms such as cookies, localStorage, or session states cannot be relied upon to persist settings or state. Any configuration parameters your page needs must be supplied via the URL query string or path, for example: 

https://yourpage.com?setting1=test&setting2=option 

This ensures predictable behavior in the Studio environment

3. HTTP Header Requirements 

Your embedded content must not include an X-Frame-Options response header. Such headers will prevent the page from loading within Studio due to security framing restrictions. Use Access-Control-Allow-Origin where appropriate to avoid framing errors

More info:
• https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
• https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin

4. Fixed Time Zone 

Ensure your embedded content operates under a fixed time zone — the server running the embedded instance may be in a different zone than your development or test environment. Set or normalize time zone logic explicitly within your page scripting.

5. Browser Engine Compatibility

 Studio renders embedded HTML pages using a Chromium 98 engine. This version does not support any browser or JavaScript features introduced after Chrome 98.

 

Can't find the right answer?
Contact the LiveU Studio Support team via our Live Chat.