Embedding a Video on Your Page
More and more, videos are becoming a normal part of an average person's web experience. Through YouTube, Google Video and more, the internet offers a quick way to share events or introduce ideas. The Salvation Army has media departments all over the world that work to put together resources that can enhance your own web presence. Additionally, some Corps have resources to film and produce their own videos.
A few YouTube and Vimeo resources, which are operated by Salvation Army media teams, include:
Salvation Army USA YouTube
Salvation Army Canada YouTube
Salvation Army USA Central Territory Videos
Sometimes, moving from a YouTube link to an embedded video on your site can be a bit daunting. Fortunately, video streaming sites encourages their visitors to embed the videos on other pages, which makes it easy for us to incorporate more interactive media into the pages we create. Below is a short tutorial on making this work for your site, in Web Manager.
Two of the most popular streaming video sites, YouTube and Vimeo, display their videos along with either a button or a section of HTML with which to embed the video:
This code contains all of the information that your page needs in order to display this video.
Select the code and copy it to your clipboard by typing CTRL+C or selecting Edit -> Copy.
Open your Web Manager and select the page that you would like the video to appear on. At this point, it is important to remember that this embed code (which we'll refer to as HTML code) cannot be pasted directly into your page editor section. It has to be put inline with the rest of your page's HTML code. This is done by selecting the HTML button -> . This button opens a pop-up window with a series of codes that look similar to this:
At this point, it is important to take note of these tags, because you will want to place the HTML code for your video in the part of your page that corresponds to these tags. For a basic introduction to HTML tags and what they do, visit the HTML coding page of this tutorial.
One of the easiest ways to determine where to put your video tags is to look for your written text in the HTML code itself. In the image above, if I were to put the mouse cursor after the < / p > tag that follows one of the sentences, then paste my video's HTML code, the code would appear directly after that sentence. Use CTRL+V or Edit -> Paste to paste the HTML code and be very careful not to delete any of the existing tags or characters!
Below is an embedded video, along with a screenshot of this page's HTML code, so you can see where it fits on this page, in relation to the items around it:
Questions? Feel free to contact your Divisional or Territorial web person, or use the Contact Us form here.