Widgets are a tool used to host BlueFrame's video player and broadcast selection area. The widget is hosted on a BlueFrame created site or separately embedded in your own site.
Please note, if you are part of a conference network or have a Web App design portal page, BlueFrame Support Staff must be contacted to edit your portal page, and this article will not be applicable.
Once on vCloud navigate to the Widget tab under Media.
Next you will click Operations, in the upper right hand corner and select Create Widget.
You will then be given multiple fields to input information on the Widget you are creating. Below are the key pieces of information to enter:
- Widget Name - what the widget will be named and displayed within vCloud.
- Associated Sites - these are the sites that will populate the widget. The broadcasts that stream on these sites will display on the widget.
- Default Site - the selected site's content will be the only content displayed on the widget by default on an initial load, the viewer would need to select another site for that content to populate it. For all selected site's content to populate the widget, leave this area blank.
- Select sections to populate this widget (optional) - these are the sections that will populate the widget. By default all of our available sections will populate widgets. Type in specific sections to narrow it down to just those that are selected.
- Date Range - Only broadcasts between the selected dates will display on the widget. Leave blank for all broadcasts to populate your widget.
- When the widget is loaded show - The widget will by default on an initial load, display either the most live-stream or the most recent archived event.
Other than the required fields, most instances of creating a widget do not require changing the other settings. Once you have filled out the desired information, click Create.
Editing the Visual Style
You will then be taken to the Visual Style page of the Widget Editor. This is also a preview of what the widget will look like your site.
On the left hand side of the screen, there is a Select Section to Edit option, by default you will be on General Settings.
Background Color - the color behind each broadcast in the area where each broadcast is listed.
- Background Hover Color - the color change that occurs when the viewers' mouse hovers over the broadcast.
- Broadcasts per Page - how many broadcasts are displayed by default on the widget display area.
Show Social Sharing Button? - Gives each broadcast a share button that provides a direct link to the broadcast and various options to share via social media.
Tabs & Filters
Show Filters - dictates if filters for broadcast searching are displayed. Filters are search fields that can accompany the widget and allow viewers to narrow down their broadcast searching.
Filter Color - the color of the bar that is utilized to Search
Select Tabs - which tabs are displayed above the broadcast listing
Select Filters - this allows you to choose which fields viewers can use to search for broadcasts and narrow down their searching.
Show this Option - this enables or disables the show more button at the bottom of the widget that allows for more broadcasts to be loaded into the list.
Font Color, Color, Hover Color - dictates the color settings surrounding the Show More button
Retrieve a Widget Embed Code
You may want a widget embed code in order to place the widget on your particular site. If you are using a BlueFrame site you will not need an embed code as we already have the widget placed on your site.
On the far right of the Widget, you will see a yellow Embed Code button, click on this button for the Widget embed code to appear on your screen.
Copy the text on screen, you will then place this code on your website in order to embed the widget on your site. Your site must be able to use HTML code, which is standard and we would expect all sites to be able to utilize this format.
If you have any additional questions, contact our support team by calling (859)-215-7979 or clicking 'New Support Ticket' at the top of this page.