Today blogging is very good method to earn money as well as to share our ideas with world. But only blog content do not do anything. So today’s tutorial is about the how to add video in blogger sidebar using add gadget.Video is a good method to tell anyone information. Because video speaks more than anything else. So just follow simple steps and add video in your blogger account. We will share some coding here. So just add this code in your sidebar anywhere. You can also update any video by simple changing code.

Steps to follow:

Step 1: Go to blogger dashboard>>>layout>>>add gadget>>>html/java script. If you do not know how to add html/java script in blogger. Than just see our before tutorial on how to add html/javascript in blogger.

Step 2: Just copy and paste below given coding in it. If you want to add any title than you can.

<div class="widget-content">

<iframe width="336" height="169" src="http://www.youtube.com/embed/gEBJeqvJReg" frameborder="0" allowfullscreen></iframe>

<style>

.label-size{

margin:0 2px 6px 0;

padding: 3px;

text-transform: uppercase;

border: solid 1px #C6C6C6;

border-radius: 3px;

float:left;

text-decoration:none;

font-size:10px;

color:#666;

}

.label-size:hover {

border:1px solid #6BB5FF;

text-decoration: none;

-moz-transition: all 0.5s ease-out;

-o-transition: all 0.5s ease-out;

-webkit-transition: all 0.5s ease-out;

-ms-transition: all 0.5s ease-out;

transition: all 0.5s ease-out;

-moz-transform: rotate(7deg);

-o-transform: rotate(7deg);

-webkit-transform: rotate(7deg);

-ms-transform: rotate(7deg);

transform: rotate(7deg);

filter: progid:DXImageTransform.Microsoft.Matrix(

M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');

zoom: 1;

}

.label-size a {

text-transform: uppercase;

float:left;

text-decoration: none;

}

.label-size a:hover {

text-decoration: none;

}

</style>

</div>

<div class="clear"></div>

<span class="widget-item-control">

<span class="item-control blog-admin">

<a class="quickedit" href="//www.blogger.com/rearrange?blogID=8193278726666811965&widgetType=HTML&widgetId=HTML15&action=editWidget&sectionId=sidebar" onclick="return _WidgetManager._PopupConfig(document.getElementById("HTML15"));" target="configHTML15" title="Edit">

<img alt="" height="18" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" width="18" />

</a>

</span>

</span>

<div class="clear">

</div>

Step 3: Now just save it. Congratulations you have done. Now video will be there in your sidebar.

Step 4: In coding there is a yellow color code. This is a embed code of YouTube video. You can change this by simple steps. Just go to YouTube. Search any video. Click on share button. Than just click on embed code. And replace this code in above coding. Now just enjoy. For reference see below image.

Step 5: You can also change your width and height of video. By simply change green color code as per your requirement.

Editor Desk:

If you like our article than just subscribe our blog. So that we can share more and more articles for you. Also do not forget to share your tips. You can also add this in your wordpress blog if you have add gadget and html/java script addition in your wordpress.