There are multiple ways to embed a video on your homepage, and each has their pros and cons. In this article you will learn how to use the Youtube embed method. The primary advantages of the Youtube embed method are that it loads fast for customers, is mobile friendly, and is easy to set up. The primary disadvantage of this method is that sometimes the video will load in a slightly lower resolution to be served up faster for customers (depending on their device settings). We suggest you try this method first and see if it fits your needs before looking at other methods.


Step 1, upload the video to Youtube.


Step 2, click "Share" on that video:


Step 3, click "embed":

Step 4, grab just the URL portion of the share (the highlighted blue area. Note that your URL will be different, this is just an example):

Step 5, paste that URL into a word document or notepad on your computer. You will need it in a minute.


Step 6, paste this code into the same notepad:


<div class="embed-responsive embed-responsive-16by9" style="margin-top:35px">

    <iframe class="embed-responsive-item" allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" src="https://www.youtube.com/embed/XXXXXX?rel=0&amp;showinfo=0;&hd=1;&mute=1;&autoplay=1;&loop=1;&playlist=XXXXXX"></iframe>

</div>


Step 7, take the partial URL that was in screenshot for step 4 (in this example, 3ZedIcewiRI) and paste that into the two "XXXXXX" spots in the Step 6. So using the example above, your final code should look like


<div class="embed-responsive embed-responsive-16by9" style="margin-top:35px">

    <iframe class="embed-responsive-item" allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" src="https://www.youtube.com/embed/3ZedIcewiRI?rel=0&amp;showinfo=0;&hd=1;&mute=1;&autoplay=1;&loop=1;&playlist=3ZedIcewiRI"></iframe>

</div>


Keep that notepad/word document open. You will need this code at the end. Note that this code is saying "autoplay this video with the sound muted, and have the video loop over and over. Show it at the highest resolution, and have it be mobile responsive to their device".



Step 8, log into your Thinkspace site admin


Step 9, click on "Content, Pages" in the top left of your admin menu:


Step 10, click on "Home" on the left so that you can edit the homepage:



Step 11, find the Dock where you want this video to be placed. In most cases that will be your banner area, and you will have this replace your existing Slideshow/Banner Slider



Step 12, drag and code a "Code Editor" widget above the Banner Slider. That will allow you to embed the youtube code



Step 13, Paste the the code you saved earlier into the Code Editor, and hit save:



Now go back to your homepage and see if the video code worked. If it did, you may want to click on "banner slider" and select "Disabled" and hit save. That will turn off your regular slide show (if you have one), so that only this video remains.