Adding Video from YouTube or Replay

Embedding video from a website like YouTube or UCI’s Replay is as easy as pasting in the URL. WordPress should automatically embed the video for you.

Note: If your videos are not displaying and you see a [youtube] shortcode, please see the Troubleshooting section below.

  1. Copy the URL for the video.
  2. Paste it on a line by itself in your post/page editor (make sure that it is not hyperlinked)
    Embed video code
  3. Preview or Publish your post or page.
  • YouTube video URLs look like: http://youtu.be/2t-MTZps42c
  • Replay videos must use the Mobile MP4 version like: http://replay.uci.edu/public/fall2013/Canvas_Setting_Up_E-portfolio_-_20130924_233246_2.mp4

Note: Video embeds only work in Pages and Posts. They do not work in widgets.

Embedded Video Example

From YouTube

From UCI Replay

Embedding with a Shortcode

If you want to resize the embedded video, you will need to wrap the URL in a shortcode.

Embed Code

 

 

Centering Video

It is possible to center your video by using the Text tab to enter some HTML and some CSS code.

  1. Click the Text tab (next to Visual) in the editor.
  2. Add the following HTML code around your video embed link.
    <div style="text-align:center;">
    /// your video embed code goes here. Make sure it is on its own line.
    </div>
    
  3. Note: The video link needs to be on its own line to be embedded. If you switch back to the visual tab, the code will all be on one line again, displaying the link to the video and not the video itself. You will have to go back to the Text tab and make sure the video link is on its own line again for the video to display properly.

Example of a centered video

 

Troubleshooting Video Embeds

  • My video link has [youtube] around it and is not displaying the video.
    Due to a plugin conflict and to be able to embed UCI Replay videos, we have disabled the video buttons. If your YouTube videos are using the [youtube] shortcode, please remove the shortcode and only use the URL to the YouTube video. Make sure the code is on its own line. See above for directions.
  • My video link doesn’t embed the video. It just links to the source.
    Make sure that the link to the video is on its own line and is not hyperlinked (underlined). If it is, use the Unlink tool to remove the link and Update your Post or Page.
  • My video link is not embedding, nor is it linked.
    If the link is formatted, it will not embed. Click the Text tab above the formatting toolbar to view the HTML. If you see extra tags like <p>, remove them so the video link is on its own line with no formatting.