Simple Step by Step Instructions for How to Place a Video in the Sidebar of Your Blog

Hello bloggers and future bloggers!   Today I would like to show you how to place a YouTube video into the sidebar of your blog. You may have a video that you would like to showcase for techniques, ideas, or to show a little about yourself. I will also show you that you can make your video appear any size that you want.
 This is how my video appears in my sidebar.

 

First let me run through the steps, then I'll show you the step-by-step process with photos.  

First things first.
You need to know the width of your sidebar. 

If you already know, just skip this step.

• From your blog click on design in the upper right hand side of your blog which takes you to your dashboard.
• Click on "Customize"
• Click on "Adjust Widths"
• Write down the Width of you Sidebar
• Now you can get out of that by clicking on "Back to Blogger"

Directions for placing your video into your sidebar

• Go to the YouTube video that you want to showcase
• Click on Share
• Click on Embed
• A code box will appear. Copy that code by right clicking on it then clicking copy
• Now go back to your blog design dashboard and click "Layout"
• Click on "Add a Gadget"
• Scroll down and click on "HTML/Java Script"
• Right click and paste you code in the box
• Change the width and height in your code to fit your sidebar (step-by-step below)
• Save and your done!

Directions to find the width of your sidebar

On your blog, Click on "Design"

Click on "Customize"

  Click on "Adjust Widths"

Write down the Width of you Sidebar. Mine happens to be 350px

 

Okay, you got your width! Now you can get out of that by clicking on "Back to Blogger"

Directions for placing your video into your sidebar

Go to the YouTube video you want to showcase

Then click on "Share"

The screen will now look like this. Click on "Embed"

Your code that you need to right click and copy will show up in a box

Now go back to your blog design dashboard and click "Layout"

Click on "Add a Gadget"

The Gadget box will appear. Scroll down and click on "HTML/Java Script"

Right click and paste you code in the box

 Now notice the width is too large for my sidebar that is only 350px

All you have to do is change these numbers and here is how to do it so it works best.

NOTE: When I change the width to fit into my sidebar I change the height too. Otherwise my video will be a strange shape.
So to keep your video the original shape, whatever you subtract from the width must also be subtracted from the height.

My blog sidebar has a width of 350. So I will take the width from the code I copied and pasted (420) and subtract the width of my sidebar (350) from it. 

420-350=70

I can make my video the exact same size as my sidebar, but it will hang over a little on the right side. So I want to make it a bit smaller.
I subtracted 20 more from the width of my video to make it 330px instead of 350px (420-330=90).

This means that when I make the width 330px I must subtract 90px from the height in the code as well. The code shows "315 height", so I must subtract 90 from it which gives me 225px. 

My new numbers to put in will now be width "330" by height "225". So just replace the numbers in your code with your new numbers and your video will fit properly and look good.

Then click "Save"

 After you've clicked "Save", it's always best to "Preview" what you've done before clicking on "Save Arrangement" just to make sure everything worked out okay.

You're done! You have your video in your sidebar. Congratulations!!!

Happy Blogging!