Video Player Module Documentation

Introduction

Group Package 1 websites contain a mix of default verbiage and imagery, with your group's details. This is managed for you by Scouts Online. There is no ability change the settings.

If you'd like to upgrade to a higher package level, please contact us.

The Video Player module allows you to add videos to your own pages and change the videos shown on other pages with a video on them.

You can show videos uploaded to YouTube or Vimeo. If you've made your own video, you will need to upload it to one of these websites before showing it on your website.

Use Cases

The following panels show specific tasks. Click on a panel to see the procedures.

Setup a Video Player

Setup a video to play on your own pages, or pages with a Video Player module on it.

Setup a Video Player module

To edit a module, follow these steps:

  • Click the settings below the module and override the default settings (see here) or add a module to your own pages, using the Page Designer
  • Set the Video Type to YouTube or Vimeo, depending on where your video is stored
  • Enter the Video Code. For instruction to get the video code, click one of these links - YouTube and Vimeo
  • You could click the Get Inspiration button to find a suitable Scouting video. See Get Inspiration for more details.
  • Enter a descriptive Name for your video. This will be displayed in the Get Inspiration list.
  • Tick Private if you don't want your video to be shown to other Scouts Online website administrators. If you think the video could be of use to others, please leave Private unticked, so others can find it.
  • Tick the Autoplay field if you want your video to play as soon as your web page is opened. NB. The sound will be turned off.
  • Tick the Loop field if you want the video to play again when it's finished
  • Set the Animation Fields as required
  • Click Save to keep your changes or Cancel to abandon your changes

NB. If you make a mistake, you may reverse the change in the Admin/Admin Audit Trail

Fig. 1: Settings Fields

Get Video Code for a YouTube Video

Find the video code to use in a Video Player module from a video on YouTube.com

Find the video code to use in a Video Player module from a video on YouTube.com

To do this, follow these steps:

  • Open YouTube.com and find a video to use
  • Open the video
  • The Video Code (Jlrimx5fjTQ is Fig. 1) can be found within the website address
  • OR by click the Source button and get the video code - between the "youtu.be/" and the "?" - Jlrimx5fjTQ is Fig. 1
  • Copy the Video Code and paste it into the Video Code field in a Video Player module

Fig. 1: YouTube Video Code

Get Video Code for a Vimeo Video

Find the video code to use in a Video Player module from a video on YouTube.com

Find the video code to use in a Video Player module from a video on YouTube.com

To do this, follow these steps:

  • If you have uploaded your own video to vimeo.com:
    • Open vimeo.com and login
    • Opening your video will show the Video Code in the browser address bar, after the "vimeo.com/" - 604936539 in Fig. 1
    • You can also click the Share button and get the video code from the Link, after the "https://vimeo.com/" - 604936539 is Fig. 2
    • Copy the Video Code and paste it into the Video Code field in a Video Player module
  • If you have seen a Vimeo video on a website, it MAY be possible to use it on your website. To find the Video Code, follow these steps:
    • On a PC, open the web page with the video on it in your browser
    • Hit the [F12] key to view the web page source HTML
    • Click somewhere inside the HTML source and press [CTRL]+[F] to open the Find field
    • You want to search for some of the text shown in the 'Embed' field in Fig. 2, so enter vimeo.com/
    • Look through each instance of the text you're searching for and look for a number after the vimeo.com/ text. You should look for a video code similar to the number circled in the 'Embed' field in Fig. 2
    • Copy the Video Code and paste it into the Video Code field in a Video Player module

Fig. 1: Vimeo Video Code in browser address bar


Fig. 2: Vimeo Video Code from Share panel

Get Inspiration

Find Scouting videos to show on your website.

The 'Get Inspiration' feature is designed could provide you with ideas of how you could use videos on your website, and show the videos that other Scouts Online website users show.

To get inspired, follow these steps:

  • Click the settings below the module and override the default settings (see here) or add a module to your own pages, using the Page Designer
  • Click the Get Inspiration button
  • You will see a list of suggested videos and non-private videos used by other Scouts Online users. See Fig. 1
  • Scroll down the list and find a video that interests you
  • Click the View button to watch the video. See Fig. 2
    You may need to scroll down to see the video.
    Click the Use This Button to use the video in your Video Player module.
  • Click the Use button to use the video in your Video Player module.
  • Click the Close button to return to the Video Player settings fields

Fig. 1: Inspiration List


Fig. 2: View video

Autoplay and Loop a Video

Set a video to play as soon as the web page is displayed and/or make the video play again when it's finished.

Set a video to play as soon as the web page is displayed and/or make the video play again when it's finished.

To set a video to play as soon as the web page is displayed, follow these steps:

  • Click the settings below the module and override the default settings (see here) or add a module to your own pages, using the Page Designer
  • Tick the Autoplay field. See Fig. 1
  • Click Save to keep your changes or Cancel to abandon your changes

Fig. 1: Set the video to autoplay

To make the video play again when it's finished, follow these steps:

  • Click the settings below the module and override the default settings (see here) or add a module to your own pages, using the Page Designer
  • Tick the Loop field. See Fig. 2
  • Click Save to keep your changes or Cancel to abandon your changes

Fig. 2: Set the video to loop