Add Video to Your site without code

You’ve heard that videos on your website can help your Google rankings. But how do you actually add them to your website? You don’t have any coding knowledge, you’re quite pleased to have been able to get the video onto YouTube, but now to get it onto your website. And on the right part of the page as well! Many amateur web administrators simply copy the Youtube link onto the top of the page.

This puts the video on there but has several limitations:

  • What if you didn’t want it at the top of the page? You wanted to introduce the video with some conextual words first before your audience plays the video.
  • You may have several videos you want to add
  • You have no choice of size
  • Or any of the other YouTube default settings

This little cheat will work for anyone who has access to the Content Management System (CMS) for their website. It will also work for anything where you have been given code to embed, for example:

  • a Mailchimp sign up form
  • a PayPal pay now button
  • a Facebook feed or feed from other social media
  • a book now button on your event booking system
  • and many many more

Let’s Cheat…

adding video to your website is not as hard as you think

Note – these instructions are for YouTube. They contain some useful advice about embedding videos as well, and also apply to Vimeo and other video streaming applications.

You may have a button in you CMS to take you to the HTML code, but when you get there, it looks like a foreign language and you avoid it like the plague. Do this instead…

  1. Create a YouTube Account and load your video into YouTube
  2. You can set videos to be public (anyone can find them), unlisted (you have to invite people to see the video) or private (for you and selected visitors only). Unlisted is a good setting to use, as people searching for your video will find it on your website rather than on You Tube)
  3. In You Tube, click on Share
  4. Then on the Embed button
  5. In the buttons below un-check the “show suggested videos at the end” as this may invite the viewer to look at your competitors’ videos.
  6. You may also need to adjust the size of the video to fit into the area you have reserved in your website.
  7. Some iframe code will appear in a drop down box. Your temperature may go up and your hands may get clammy as this is “real code” but fear not, you don’t need to be able to read it.
  8. Copy the iframe code
  9. In your CMS go to the page where you would like to embed the video.
  10. To make life easier for you, simply type a whole load of Xs where you want the video to appear. Just like this
    xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    This is quite therapeutic so feel free to hold the X key down for a while.
  11. Now take a deep breath and click on the HTML editor button.
  12. Now in among all the foreign language gobbledygook, you should be able to find all the Xs. Really easily.
  13. Highlight just the xxxxxxxx text and paste the iframe html over the top replacing all the Xs.
  14. And save.

Ta da! You have just updated real code, and put your video exactly where you want it. Congratulations!

Categories: Web Design Tips & Cheats.

Leave a Reply

Your email address will not be published. Required fields are marked *