How to add YouTube video into the Splash Portal

You can embed into the Splash Portal a video coming from an external source, such as YouTube. This can be done by using an HTML content block.

Please, consider that any external content and media can be shown into the Splash Portal in the pre-authentication mode only if the domain hosting the media is opened in the access network Walled Gardens.
The pre-authentication mode is the Splash Portal prompt to the user before the sign-in.

In case of embedding a YouTube video, for example, you should add the domain "youtube.com" to Walled Gardens.

1) To embed a video from YouTube you can simply get the code from the YouTube web site, as shown below:



2) Create an HTML content type in the Splash Portal content block gallery.



3) Enable the HTML view in the text editor



4) Paste the code you copied from YouTube

Make the video tailored for mobile devices

To adapt the video also to small screen, such as smartphones, you can use some CSS style. Below an example of the code you can paste into the HTML content type (change the video ID with your)

	

<style type="text/css">


.auto-resizable-iframe {
  max-width: 420px;
  margin: 0px auto;
}

.auto-resizable-iframe > div {
  position: relative;
  padding-bottom: 75%;
  height: 0px;
}

.auto-resizable-iframe iframe {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

 </style>

<div class="auto-resizable-iframe">
  <div>
    <iframe id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/UN4jRoFKwW0?rel=0&amp;fs=1 controls=0&amp;modestbranding=1&amp;rel=0&amp;showinfo=0&amp;autohide=1&amp;theme=dark" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>
  </div>
</div>

• Related Articles

• External links: add links to external URLs to your Splash Portal

  External links is an application which allows to publish items within the App Bar in the Splash Portal, in order to provide links for external URLs. Control Panel management By clicking the Manage button it is possible to manage all the items for the ...

• General Splash Portal Templates

  Splash Portal   A Splash Portal template is a way to define the page layout for the Splash Portal. The Solution supports many Splash Portal templates and they can be available to the Tenant according to its enabled license. The standard layout for ...

• Customizing the Splash Portal defining content blocks

  The content blocks section, accessible from the Splash Portal section, is dedicated to the creation and management of the contents that populate Splash Portals that were created from a Splash Portal template. The content can be associated to a ...

• "Splash Portal" Analytics - monitoring the activities of end-users through the Splash Portal

  By selecting Users from the drop-down menu in the top-left corner  it is possible to retrieve data about the activities of end-users into the Splash Portal. The Tenant is able to filter results by selecting all WiFi Areas or only a particular WiFi ...

• App Bar: The apps container for your Splash Portal

  App Bar is an application consisting of a dynamic bar which can be published in the Splash Portal and allows end-users to easily access to external web URLS or active applications. Control Panel management By clicking the Manage button it is possible ...