How to Add Videos

Avatar
Kyle Phillips
Updated

Uploading your Video

You need to use a third-party video hosting service to store and serve video.  These services are built specifically for serving high quality video, and their accounts are free.  Start by creating an account and uploading video to a video-hosting site.  The following are possible options, though you can use any hosting service that provides and embed code:

***

Copying the Embed Code of your Video

After you have uploaded your video clip to an online video service, locate and copy the embed code for the service’s video player.  Each provider will have code that looks slightly different.  Here’s an example of Vimeo’s embed code:

<iframe src=”https://player.vimeo.com/video/27456045953″ width=”800″ height=”500″ frameborder=”0″ webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>


Turning Off Related Videos at the End of Your Video

These settings are all controlled through the service you are using to host your video.  When you grab your embed code from your video host, there is generally an option that allows you to include or exclude related videos.  If you have a video on your site that is playing related videos, you will need to replace the embed code for that particular video.

Setting Your Video to Autoplay

For videos, setting autoplay is something you need to do at your video host when you grab your embed code.  Vimeo provides a “Customize Embed Options” link when viewing their embed code, and one of those options is for autoplay. For YouTube, you need to add “&autoplay=1″ to the end of the URL in the iframe embed code.

 

Using a Video as the Main Element on the Story Page

  1. Open your story in edit mode or create a new story and add a headline.
  2. Choose Do Not Display under the Featured Image Location
  3. Paste the video's embed code in the Video Embed Code box on the right side.
  4. If you want, add a credit for the video in the Video Credit Line.
  5. Choose where you want the video to appear using the Location dropdown menu in the Vide/Embed box.
  6. Click Update.

Adding a Video as a Standalone Story

  1. Click on Add Story in the Stories tab on the left navigation bar in the WordPress dashboard.
  2. Enter the Headline for the article.
  3. If you have a story or short explanation of your video, paste that in the main text-editing window.  DO NOT add your video in this window.
  4. Paste your video embed code in the Video/Embed box on the right side of the main text-editing window.
  5. If you want to give credit for the video, add a name in the Video Credit Line box.  If there is a staff profile for this name, this video will automatically be linked to that staff profile.
  6. You can set a featured image to appear in SNO Story widgets, if you'd like. In the Featured Image box, set the Location dropdown to "Do not display on Story Page," if you do not want this image to appear on the story page.
  7. Assign this story to a category.
  8. Click Publish.

Adding a Standalone Video Widget to the Site

  1. Click on Widgets under the Appearance tab on the left navigation bar in the WordPress dashboard.
  2. Drag a SNO Embed Code widget into one of your Widget Areas.
  3. Paste your video's embed code into the Text box. Adjust your customization choices.
  4. Click Save on the widget.

Setting the SNO Story List Widget to Display Video on Homepage

  1. Click on Widgets under the Appearance tab on the left navigation bar in the WordPress dashboard.
  2. Drag a SNO Story List widget into one of your Widget Areas.
  3. Choose the category that contains the story with your video in it in the Select a Category dropdown in the first column.
  4. Change the Media Type dropdown menu in the second column of the widget settings from Photo to Video. Only videos displayed in the Primary Area of this widget will be playable from your homepage. Screenshot 2024-03-04 at 1.16.47 PM.png
  5. Click Save on the widget.  

NOTE: You can also paste your video embed code in a SNO Embed Code widget in any of your Widget Areas.  Videos added this way will not be archived by your site. 

Using a Video as an Element of the Interest within the Story

  1. While adding/editing a story, place your cursor in the place you’d like the video to go. Usually, it works best to press enter, giving the video it’s own line in the text editing box.
  2. Click the Add SNO Story Element button above the text editing window.
  3. A pop-up window will give you all of the different options story elements, click the button for Video Embed.
  4. Add your video's embed code in the Video Embed Code box. Add a video credit and adjust the Alignment dropdown, if you'd like.
  5. Click the Insert button.
  6. A line of short code will now show up in your story.
  7. Click Update/Publish and go to view the story to see how your story page looks.
Was this article helpful?
34 out of 52 found this helpful

Related articles