How to use the Webcam Widget

Arreya’s webcam widget is a useful tool for users who want to display live webcam feeds. In this article, we will walk through how to use the webcam widget, and at the bottom of the page, you’ll find our full YouTube video, which also walks through the process of using the webcam widget.

 

Getting Started

First, log in to your Arreya channel. In your dashboard, click the Content menu at the top of the page, and then click presentations. Next, click “widgets” on the top menu bar, then click “webcam.”

Webcam Widget Settings

 

 

 

 

 

 

 

 

 

The top section shows a preview of how the widget will appear before inserting it into the presentation. Below the preview, you will find the widget settings. First choose to either display the widget using your Webcam URL or by using a Live Input with the Widget format dropdown.

Using Webcam URL

When using the Webcam URL, first enter the stream URL for your webcam or IP camera. Use the [Refresh Time] field to choose how often the webcam feed will refresh. Click the [Scaling] toggle to choose sizing options. Click [Fill] to have the feed fill the previously selected sizing, or click [Fit] to have the feed stay in its original aspect ratio.

Using Live Input

 

 

 

 

 

 

 

 

 

When using a Live Input use the “Scaling” toggle to choose sizing options. Click “Fill” to have the live input fill the previously selected sizing, or click “Fit” to have the live input stay in its original aspect ratio. Use the “Enable Video” toggle to display video for the live input. Use the “Video Input” field to choose which video input to use. The webcam widget will automatically choose the device’s default video input. Use the “Enable Audio” toggle to play audio for the live input. Use the “Audio Input” field to choose which audio input to use. The webcam widget will automatically choose the device’s default audio input. Lastly, use the “Volume” field to choose the volume of the audio.

For more detailed information on setting up live input, including required hardware, CLICK HERE.

Final Steps

When you are finished with the widget settings, click the “OK” Button to add the Webcam widget to your page. Drag the widget to move it, or use the bounding box to resize it. Click the purple brush icon below the widget to open the Style settings. In the Style settings you have options for color, transparency, borders, shadows and more. When finished click OK. If you want to adjust the widget settings after adding it to the page, Click the purple Gear icon below the widget to open the Settings menu. If you need additional Webcam widgets, you can add additional widgets from the ‘Widgets’ menu and repeat these steps. When you are finished, click the Green “Push Live” button to update your presentation.

 

 

How to use the Translate Widget

 

  1. From your Dashboard go to [Content] then [Presentations]
  2. Select the green [Edit] button on the desired presentation
  3. Select [Translate] from the [Widgets] drop down menu
  4. In the ‘Language’ drop down you can select the language you would like your signage translated to. In the ‘Text’ field you can edit the button text that will display on the touch point.
  5. Click [OK] once finished to insert the new Translate touch point.
  6. Remember: This only creates a touch point for that one language. You should include a button for English as well so that it can be returned to the original language if necessary.
  7. Remember to save your changes by pushing the green [Push Live] button in the top right of the editor

How to Embed a Livestream with the Streaming Widget

 

The streaming widget is primarily for direct HLS feeds from an encoder. Displaying a stream that is hosted on a website is best done by using the Website Widget. You can find details on how to accomplish this here: For security reasons the HLS URL generated by the encoder needs to be HTTPS with a valid security certificate. Many encoders do not support this. We recommend products from this page:

  1. From your Dashboard go to [Content] -> [Presentations]
  2. Click [Widgets] near the top left and click [Streaming] from the drop-down
  3. Paste the HLS URL into the “URL or Text” field
  4. Configure the settings below how you would like best
    1. Enabling Controls will allow a user to pause, adjust volume, or skip around in the video/livestream if available
    2. Autoplay will play the video automatically upon the slide becoming active
    3. Loop being enabled will loop the video/livestream if applicable
    4. Mute will prevent the video/livestream from having sound unless unmuted by a user
    5. The volume slider will set the default volume for the video/livestream
  5. Click [OK] and you should now have a video player that you can resize or adjust the style
Inserting a block of HTML with the HTML widget

Inserting a block of HTML with the HTML widget

  1. From your Dashboard go to [Content] then [Presentations]
  2. Select the green Edit button the desired presentation
  3. Select [HTML] from the [Widgets] drop down menu
  4. Use the [HTML] field to insert a variety of HTML tags
  5. Click [Ok] to create the HTML widget
  6. Remember to save your changes by pushing the green [Push Live] button in the top right of the editor
Inserting a RSS feed with the RSS widget

Inserting a RSS feed with the RSS widget

  1. From your Dashboard go to [Content] then [Presentations]
  2. Select the green Edit button the desired presentation
  3. Select [RSS Feed] from the [Widgets] drop down menu
  4. Use the [Feed URL] field to choose the URL for your desired feed
  5. Use the [Widget Format]  drop down to choose how the feed is formatted
  6. Use the  [Item Animation] drop down to choose the transition style between RSS items
  7. Use the [Max Items] field to choose the maximum amount of feed items to be displayed
  8. Use the [Separator] field to select a separator for between feed items
  9. Use the [Title] switch to choose whether to display feed item titles
  10. Use the [Description] switch to choose whether to display feed item descriptions
  11. Click [Ok] to insert the RSS widget
  12. Remember to save your changes by pushing the green [Push Live] button in the top right of the editor