Embed TrilbyTV content in a VLE?

TrilbyTV offers a couple of different ways to embed content in your VLE or website.

Click the Edit pencil icon on a content item to view the edit options. Click the toggle to enable the Public Sharing option and agree that it is OK to share the content item publicly, then click Save. You can now click Get Sharing Information. There are four items shown.

Note: Web players and embedded content will always be muted, see this article to learn why and how to work around this.

  • Public Link – This is a standalone web page that you can send to anyone to enable them to view that content item. It doesn’t require a login, so is ideal for sharing online via Facebook, Twitter, or in an email newsletter.
  • Embed Code – This HTML code can be copied into a page on your VLE  or website and will include the content item inline with your other page content, allowing visitors to the page to view the content right there. This uses an Iframe to embed.
    Example Embed code: 
  • <iframe src="https://app.trilbytv.co.uk/public/19b376da-9371-4689-bbcd-cbbaa3a3351f" width="480" height="270" frameborder="0" allow="autoplay" allowfullscreen></iframe>

    Note: You can optionally adjust the width and height (in pixels) shown in the Iframe code. Be sure to maintain the same aspect ratio or the image will stretch when on the page.

  • Image Link – Some VLE’s or website tools may not allow Iframe embedding of content, or you may wish to add a rich link to an email newsletter. In this case, use the Image Link instead. This will place a thumbnail image of your content on the webpage, which will link to the Public Link page. This can then be clicked on by visitors to view the content.
    Example Image Link code: 
  • <a href="https://app.trilbytv.co.uk/public/view/2c35e5bb-99a0-4b81-9ed1-ae9a3a39b853" target="_blank" title="Bioluminescence" style="text-decoration: none;"><img src="https://api-web.trilbytv.co.uk/public/preview/2c35e5bb-99a0-4b81-9ed1-ae9a3a39b853?button=1" style="width:480px; height:270px; border:none;" alt="Bioluminescence" width="480" height="270" /></a> Bioluminescence
  • You also have the option to Share to Google Classroom. Click the icon and a Google Classroom window will open giving you options of where you want to send this within Google Classroom.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us