800.885.8886 sales@telvue.com
  • Facebook
  • Twitter
  • Facebook
  • Twitter
TelVue
  • Home
  • Products
    • Playback & Automation
      • HyperCaster®
      • ProVue®
        • ProVue® HD
        • ProVue® GFX
        • ProVue® CC
      • TelVue TeleCastTM 2
    • Streaming/Cloud
      • TelVue CloudCast™
      • TelVue Connect™
      • Media Exchange
      • Mobile & OTT Apps
      • TelVue SmartCaption™
    • Digital Signage
      • TelVue InfoVue™
    • Automatic Captioning
      • SmartCaption™
    • Ad Insertion
      • TelVue AdCaster™
  • Solutions
    • Cable/Telco
    • Community Media
    • Media Companies
  • Support
    • Knowledge Base
    • Webinars
    • Training Videos
    • Documentation
    • Contact Support
  • News
    • Blog
    • Press
    • Awards
  • Client Logins
    • Connect/CloudCast
    • InfoVue
  • Contact Us
    • General & Sales
    • Technical Support
Select Page

Connect/CloudCast

Connect User Manual
  • TelVue Connect™ User Manual (v2.6)
  • Organization Settings
  • Getting Started
  • Upload and Transcode Content
  • Enter Metadata
  • Metadata Presets
  • Broadcast Server Integration
  • Distribution
  • Manage Storage Space in Connect
  • Manage User Accounts
  • Email Notifications
  • Publishing and Moderation
  • Create and Schedule Series
  • Fill a Series with Episodes
  • Create and Schedule Playlists
  • TelVue Connect Media Exchange
  • How to Syndicate Content to the Media Exchange
  • Series Syndication
  • Syndication Reports
  • SmartCaption™ Automatic Closed Captioning
  • Custom Language Models
  • SmartCaption™ Caption Translation
  • Manage CloudCast Content
  • Add Live Streams to CloudCast
  • CloudCast Video Player (Connect VOD Player)
  • Share and Embed Videos
  • Manage Connect/CloudCast Categories
  • Add Chapters
  • Add Attachments
  • CloudCast Banner Ads
  • Getting Started with Roku
  • Manage Roku App
  • Getting Started with Apple TV
  • Manage Apple TV App
  • CloudCast MRSS
  • Podcasting
  • Bulk Action Feature Requirements
  • RSS Feeds
  • TelVue Connect Contributors’ Guide (PEG version)
  • TelVue Connect Contributors’ Guide (CableLabs version)
  • Cable Option
CloudCast User Manual
  • Manage CloudCast Content
  • Add Live Streams to CloudCast
  • CloudCast Video Player (Connect VOD Player)
  • Share and Embed Videos
  • Manage Connect/CloudCast Categories
  • Add Chapters
  • Add Attachments
  • CloudCast Banner Ads
  • Getting Started with Roku
  • Manage Roku App
  • Getting Started with Apple TV
  • Manage Apple TV App
  • SmartCaption™ Automatic Closed Captioning
  • Custom Language Models
  • SmartCaption™ Caption Translation
  • CloudCast MRSS
  • CloudCast Training Videos
Media Exchange
  • How to License Content from the Media Exchange
Connect APIs
  • JSON REST API – version 2 – Media
  • JSON REST API – version 2 – Videos
  • JSON REST API – version 2 – Playlists
  • JSON REST API – version 2 – Playlist Items
  • JSON REST API – version 2 – Series
  • JSON REST API – version 2 – Categories
  • JSON REST API – version 2 – Roku Applications
  • Home
  • Knowledge Base
  • Connect/Cloudcast Knowledge Base
  • Connect/CloudCast
  • Cloud FAQs
  • Add a video or stream to your org’s Facebook page

Add a video or stream to your org’s Facebook page

If you have a Facebook fan page for your organization, you can add an “app” to your page that allows visitors to view any of your CloudCast videos or streams without leaving Facebook.

To do this, you’ll need management control of your Facebook fan page and around 10-15 minutes of time.

How does it work?

Facebook “pages” (sometimes called fan pages, or organization pages) can have apps installed to them that create additional “tabs” that visitors can browse to. Most fan pages already come with a set of existing tabs, like those for viewing Photos or Videos.

This guide will show you how to add a new tab to your existing page that visitors can click to view CloudCast content. To see a demonstration of how this works, view the AMGTV Facebook page and click the “Watch Live” tab icon:

After clicking to that tab, a large CloudCast video player appears and automatically begins playing the AMGTV live stream.

Follow along below to add similar functionality to your Facebook fan page.

Step 1 – Install the app

For this setup, we will use an existing Facebook app called “Static HTML”. This is a free application from another publisher that allows page managers to create a tab and add arbitrary HTML, which is perfect for showing CloudCast videos.

Once logged into the Facebook account that has control of your fan page, install the Static HTML app. Click the large blue button to install the app.

Choose your Facebook fan page from the drop down, and then proceed by clicking the “Add Page Tab” button.

Step 2 – Configure app

After the app is installed, you’ll likely be brought to your pages management screen. If not, simply browse to it. Down towards the middle, your page’s cover photo and “tabs” are show.

Here, the new “tab” that the Static HTML app added is circled in red. If the “Welcome” tab with the star icon does not appear, try clicking the small arrow to the right to reveal additional tabs.

From this screen, there will be a green button near the top called “Edit Tab”. Click that button and you’ll be brought to an overlay screen.

Clear out the sample text in the textarea. Here is where you’ll place the HTML markup to embed a CloudCast player. You don’t need extensive HTML know-how to get this working. Here’s a template you can just copy and paste:

<html>
<head>
<style>
body { font-family: sans-serif; size: 13px; }
</style>
</head>
<body style="background-color:#F7F7F7">
<div class="container" style="width:810px; padding:0;">
<div style="width: 100%">
<div style="text-align:center; background-color:#C9C9C9; padding:24px 0px">
{{Cloudcast Iframe Code}}
</div>
</div>
<div class="row">
<div class="span" style="width: 100%; text-align: center">
<h2>{{Headline}}</h2>
<p class="lead" style="max-width: 80%; display: inline-block;">
{{Paragraph}}
</p>
</div>
</div>
</div>
</body>
</html>

After pasting it in, you can replace some of the content with what you want. Grad a CloudCast video embed code from the CMS and paste it in, replacing “{{Cloudcast Iframe Code}}”.

Click the “Save and Publish” button on the top right, and then click the “View tab on Facebook” button on the top left.

Step 3: Further customization

After completing the steps above, you should have a working Facebook tab on your fan page. You can customize the look and feel of the tab content however you want, perhaps even embedding the full CloudCast player instead of a single video.

There’s a couple things left you’ll probably want to take care of.

Change the tab icon

Facebook has a list of instructions on how to do this here: https://www.facebook.com/help/201402119964259.

Change the tab name

Edit the tab content like we did earlier (by clicking the green “Edit Tab” button. This time, scroll down further and you’ll see a text field where you can change the name from “Welcome” to something else. Perhaps “Watch Live” is appropriate for you if you embed a CloudCast player that shows your live stream of content.

Change the order of tabs for your page

If you have multiple tabs on your page, some may get buried out of sight, since Facebook will usually only display 3 tabs at once.

That’s a wrap!

Share This Article :
  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
Still stuck? How can we help?

How can we help?

Updated on December 1, 2022
Who specifies the transcoding parameters?

PRODUCTS

  • Playback & Automation
    • HyperCaster®
    • ProVue®
      • ProVue® HD
      • ProVue® GFX
      • ProVue® CC
    • TelVue® TeleCastTM 2
  • Streaming/Cloud
    • TelVue CloudCast™
    • TelVue Connect™
    • Media Exchange
    • Mobile & OTT Apps
    • TelVue SmartCaption™
  • Digital Signage
    • TelVue InfoVue™
  • Automatic Captioning
    • SmartCaption™
  • Ad Insertion
    • AdCaster™

SUPPORT

  • Contact Support
  • Knowledge Base
  • Training Videos
  • Product Documentation

ABOUT

  • Contact Us
  • TelVue News for Hyperlocal Broadcast, PEG news, and TV Technology
  • Press Releases
  • Executive Profiles
  • Sales Team
  • Company
  • Partners

BLOG POSTS

  • HyperCaster Integrated Streaming & Social Streaming Automation
  • Live Dual-language Captioning, Multiple Trim Editing, and Multistreaming Automation with HyperCaster™ 8.3
  • AIO Integrated Streaming, Program Guide & Clock Overlays with HyperCaster™ 8.2
  • Channel Streaming Rights Management with HyperCaster™ 8.1
  • Enhanced Captioning Accuracy and Security with HyperCaster™ 8.0
  • Facebook
  • Twitter
16000 Horizon Way, Suite 100, Mt. Laurel, NJ 08054 - TelVue Corporation ® All Rights Reserved 2020