← BACK TO HOME

Embed Videos in Your Website

Embed Videos in Your Website

The process of encoding a video for the web can be tricky. That said, there are services out there like Youtube, Vimeo and others that allow you to upload and host your videos and they take care of the encoding for you. Once on their servers both Youtube and Vimeo give you the option to grab what is called “embed” code. This is code that will allow you to embed the video in your Portfolio Website, Promo Pages or Blog. FolioLink HTML5 website designs like Brasilia and Auckland make it easy for you to add externally hosted videos right into your portfolios allowing you to create a portfolio that is a mix of stills and videos or create an entire portfolio for video display only. If you prefer not to use a third party service and know how to encode your own videos for the web using Final Cut Pro® or Adobe® Premiere® Pro you can host your videos with FolioLink. Be sure to use a web preset that is compatible with the iPhone and iPad and other mobile devices. The preset will also work with desktops. If that is your preference, just contact us for more information.

For those of you uploading to Youtube or Vimeo – the following steps will be helpful. We will focus on the Youtube interface, but Vimeo will offer similar options. Again if you need assistance, just call us.

1) After uploading your video you need to find the embed code. Underneath your video locate the “Share” option.

Share

2) From there locate the “Embed” option.

Embed

3) Pay close attention to these two options for your embed code:

  • Video display size
  • Show suggested videos when the video finishes

In general when embedding a video for a portfolio website, you will not want other suggested videos to appear after your video plays. Be sure to deselect that option as depicted in the image below.

Deselect Suggestions

If you want to learn how to alter the embed code so that your video auto plays without a click or if you need further guidance please visit Youtube’s help page here: https://support.google.com/youtube/answer/171780?expand=PrivacyEnhancedMode.

4) Adding your video to your FolioLink Portfolio Website is easy. Just upload an image to a portfolio. This image will serve as the “cover” image for the video. Then click on the “More Tab” for that image. Select “Link to Viewer” and then select “Embed Code” for type of viewer. The only other thing you will need to add here are the video dimensions.

More Tab

Now let’s take a look at how videos look once added to a Portfolio Website.

FolioLink client: Marlon Krieger uses Vimeo to host his videos. These videos are encoded to work on the iPad and desktop/laptop environment: http://marlonkrieger.com

FolioLink client: Scott Christensen opted to upload his videos to Youtube and has turned on the advertising option so that he can monetize his video views. These videos are encoded for the desktop/laptop environment: http://christensenstudio.com

FolioLink client: Muriel Hasbun is using FolioLink video hosting. These videos are encoded for the desktop/laptop environment: http://www.murielhasbun.com