This is default featured slide 1 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 2 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 3 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 4 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 5 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

Showing posts with label Internet. Show all posts
Showing posts with label Internet. Show all posts

10 February 2014

Online Word Counter Tool

Word Counter is a tool which counts the number of words in an inputted group of text.This is a very useful tool for bloggers and webmasters to understand the length of their post.

How To Use?
Simply copy-paste the text for which you want to count the number of words in the box below.Then press 'Calculate Words' button to count.

 
Is the tool not working as it should? Report Us

Sharing Is Caring

Why You Should Submit Your Site To Technorati?

Submitting your site to different search engines is a very important step to build up your traffic.Quality of search engines also plays a very important role in building up traffic.Technorati has an Alexa Rank of around 2000 with more than 400,000 backlinks.That is why you should submit your site to Technorati which is a searching engine for searching blogs.

Why You Should Submit Your Site To Technorati?
If you are a blogger and you wish to run direct advertising on your site then you should keep reading.Advertisers look for Alexa Rank,Google PageRank,Technorati Rank,etc. to know your site popularity.So you need to have a better Technorati Rank too.

Does Site Submission To Technorati Cost?
No,you may not need to pay in order to get your site listed in Technorati.

How To Submit Your Site To Technorati?

  1. Go to Technorati.com and sign up for a new account.
  2. Go to your account page.
  3. Enter the url of your blog in the My Claimed Blogs section.


  4. Fill up the form and hit Proceed to next step button.
  5. You will now receive a code in your email. e.g U9FZDM4HR8NH
  6. You will need to publish a post along with the code to verify your site.(It should be made visible)
  7. Once published go to your account page.Under the My Claimed Blogs click check claim to check your claim.
The account page referred here is your profile page.

Is this not what you are looking for?Request a post.
Report a problem with this post or request update.

Sharing Is Caring

Measure Pixels Online With This Free Browser Tool


MeasureIt is a browser extension for Chrome,Firefox and Safari to measure pixels online.This is a very useful extension if you are a blogger or web developer.MeasureIt allows you to draw a ruler across the screen to measure the width and height.A translucent overlay comes across the screen while measuring to avoid clicks.
This tool will be very useful when you want to:
  •  measure website component size without even looking at the original source code
  • measure header images of websites
  • design a responsive website
  • re-size your site components
  • before applying padding styles in CSS for your website
Free Download Links

Keyboard Shortcuts 

Use the below screenshot for keyboard shortcuts for your measure it tool.

keyboard shortcuts for measureit









How To Remove The MeasureIt Overlay In Chrome Without Refreshing The Page

  1. Once you completed measuring open chrome developer tools by right clicking and opening Inspect Element tools or click Ctrl + Shift + I
  2. You will see a code like this <div id="measureit">

  3. Right click on the code and click on Delete Node to delete the entire measure it overlay code.

Sharing Is Caring

How To Add Buttons To Blogger Posts?


Add buttons to blogger posts
Buttons helps you to add links in an attractive and convenient way.It also helps the visitor to quickly find the link without reading the whole post.Moreover it gives a professional touch to your blog.Buttons can be made highly attractive with CSS which forces the user to click on it.This post will teach you how to add buttons to your blogger post.



How To Add Buttons To Blogger Post?

  1. Go to your Blogger Dashboard  > Templates > Customise > Advanced  > Add CSS
  2. Copy-Paste any of the below CSS code.
  3. Then copy the button code and paste it in your desired location.
  4. Switch to HTML view and replace the the button name.
  5. Then go back to Compose mode.
  6. Add the link to the button name text.{To make the button open the link in new tab simply check the open link in new tan option in link to option.

Different Styled CSS Buttons

Button 1
.styled-button-1 {
 -webkit-box-shadow:rgba(0,0,0,0.2) 0 1px 0 0;
 -moz-box-shadow:rgba(0,0,0,0.2) 0 1px 0 0;
 box-shadow:rgba(0,0,0,0.2) 0 1px 0 0;
 color:#333;
 background-color:#FA2;
 border-radius:5px;
 -moz-border-radius:5px;
 -webkit-border-radius:5px;
 border:none;
 font-family:'Helvetica Neue',Arial,sans-serif;
 font-size:16px;
 font-weight:700;
 height:32px;
 padding:4px 16px;
 text-shadow:#FE6 0 1px 0
}
Embed code:<a href="Link" class="styled-button-1">Button name</a>

Button 2
.styled-button-2 {
 -webkit-box-shadow:rgba(0,0,0,0.2) 0 1px 0 0;
 -moz-box-shadow:rgba(0,0,0,0.2) 0 1px 0 0;
 box-shadow:rgba(0,0,0,0.2) 0 1px 0 0;
 border-bottom-color:#333;
 border:1px solid #61c4ea;
 background-color:#7cceee;
 border-radius:5px;
 -moz-border-radius:5px;
 -webkit-border-radius:5px;
 color:#333;
 font-family:'Verdana',Arial,sans-serif;
 font-size:14px;
 text-shadow:#b2e2f5 0 1px 0;
 padding:5px
}

Embed code:<a href="Link" class="styled-button-2">Button name</a>

Button 3
.styled-button-3 {
 -webkit-box-shadow:rgba(0,0,0,0.0.1) 0 1px 0 0;
 -moz-box-shadow:rgba(0,0,0,0.0.1) 0 1px 0 0;
 box-shadow:rgba(0,0,0,0.0.1) 0 1px 0 0;
 background-color:#5B74A8;
 border:1px solid #29447E;
 font-family:'Lucida Grande',Tahoma,Verdana,Arial,sans-serif;
 font-size:12px;
 font-weight:700;
 padding:2px 6px;
 height:28px;
 color:#fff;
 border-radius:5px;
 -moz-border-radius:5px;
 -webkit-border-radius:5px
}

Embed code:<a href="Link" class="styled-button-3">Button name</a>

Button 4
.styled-button-4 {
 -webkit-box-shadow:rgba(0,0,0,0.98) 0 1px 0 0;
 -moz-box-shadow:rgba(0,0,0,0.98) 0 1px 0 0;
 box-shadow:rgba(0,0,0,0.98) 0 1px 0 0;
 background-color:#EEE;
 border-radius:0;
 -webkit-border-radius:0;
 -moz-border-radius:0;
 border:1px solid #999;
 color:#666;
 font-family:'Lucida Grande',Tahoma,Verdana,Arial,Sans-serif;
 font-size:11px;
 font-weight:700;
 padding:2px 6px;
 height:28px
}

Embed code:<a href="Link" class="styled-button-4">Button name</a>

Button 5
.styled-button-5 {
 background-color:#ed8223;
 color:#fff;
 font-family:'Helvetica Neue',sans-serif;
 font-size:18px;
 line-height:30px;
 border-radius:20px;
 -webkit-border-radius:20px;
 -moz-border-radius:20px;
 border:0;
 text-shadow:#C17C3A 0 -1px 0;
 width:120px;
 height:32px
}

Embed code:<a href="Link" class="styled-button-5">Button name</a>

Button 6
.styled-button-6 {
 background:#f78096;
 background:-moz-linear-gradient(top,#f78096 0%,#f56778 100%);
 background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#f78096),color-stop(100%,#f56778));
 background:-webkit-linear-gradient(top,#f78096 0%,#f56778 100%);
 background:-o-linear-gradient(top,#f78096 0%,#f56778 100%);
 background:-ms-linear-gradient(top,#f78096 0%,#f56778 100%);
 background:linear-gradient(top,#f78096 0%,#f56778 100%);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f78096',endColorstr='#f78096',GradientType=0);
 padding:5px 4px;
 color:#fff;
 font-family:'Helvetica Neue',sans-serif;
 font-size:12px;
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 border:1px solid #ae4553
}

Embed code:<a href="Link" class="styled-button-6">Button name</a>

Button 7
.styled-button-7 {
 background:#FF5DB1;
 background:-moz-linear-gradient(top,#FF5DB1 0%,#E94A86 100%);
 background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#FF5DB1),color-stop(100%,#E94A86));
 background:-webkit-linear-gradient(top,#FF5DB1 0%,#E94A86 100%);
 background:-o-linear-gradient(top,#FF5DB1 0%,#E94A86 100%);
 background:-ms-linear-gradient(top,#FF5DB1 0%,#E94A86 100%);
 background:linear-gradient(top,#FF5DB1 0%,#E94A86 100%);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF5DB1',endColorstr='#E94A86',GradientType=0);
 padding:5px 7px;
 color:#fff;
 font-family:'Helvetica Neue',sans-serif;
 font-size:12px;
 border-radius:4px;
 -moz-border-radius:4px;
 -webkit-border-radius:4px;
 border:1px solid #E8124F
}

Embed code:<a href="Link" class="styled-button-7">Button name</a>

Button 8
.styled-button-9 {
 background:#00A0D1;
 background:-moz-linear-gradient(top,#00A0D1 0%,#008DB8 100%);
 background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#00A0D1),color-stop(100%,#008DB8));
 background:-webkit-linear-gradient(top,#00A0D1 0%,#008DB8 100%);
 background:-o-linear-gradient(top,#00A0D1 0%,#008DB8 100%);
 background:-ms-linear-gradient(top,#00A0D1 0%,#008DB8 100%);
 background:linear-gradient(top,#00A0D1 0%,#008DB8 100%);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00A0D1',endColorstr='#008DB8',GradientType=0);
 padding:8px 20px;
 color:#cfebf3;
 font-family:'Helvetica Neue',sans-serif;
 font-size:13px;
 border-radius:40px;
 -moz-border-radius:40px;
 -webkit-border-radius:40px;
 border:1px solid #095B7E
}

Embed code:<a href="Link" class="styled-button-9">Button name</a>

Button 9
.styled-button-11 {
 background:#FEDA71;
 background:-moz-linear-gradient(top,#FEDA71 0%,#FEBB49 100%);
 background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#FEDA71),color-stop(100%,#FEBB49));
 background:-webkit-linear-gradient(top,#FEDA71 0%,#FEBB49 100%);
 background:-o-linear-gradient(top,#FEDA71 0%,#FEBB49 100%);
 background:-ms-linear-gradient(top,#FEDA71 0%,#FEBB49 100%);
 background:linear-gradient(top,#FEDA71 0%,#FEBB49 100%);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FEDA71',endColorstr='#FEBB49',GradientType=0);
 padding:8px 18px;
 color:#623F1D;
 font-family:'Helvetica Neue',sans-serif;
 font-size:16px;
 border-radius:48px;
 -moz-border-radius:48px;
 -webkit-border-radius:48px;
 border:1px solid #623F1D
}

Embed code:<a href="Link" class="styled-button-11">Button name</a>

Button 10
.push_button {
 position: relative;
 width:220px;
 height:40px;
 text-align:center;
 color:#FFF;
 text-decoration:none;
 line-height:43px;
 font-family:'Oswald', Helvetica;
 display: block;
 margin: 30px;
}
.push_button:before {
 background:#f0f0f0;
 background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D0D0D0), to(#f0f0f0));
 
 -webkit-border-radius:5px;
 -moz-border-radius:5px;
 border-radius:5px;
 
 -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
 -moz-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
 box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
 
 position: absolute;
 content: "";
 left: -6px; right: -6px;
 top: -6px; bottom: -10px;
 z-index: -1;
}

.push_button:active {
 -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset;
 top:5px;
}
.push_button:active:before{
 top: -11px;
 bottom: -5px;
 content: "";
}

.red {
 text-shadow:-1px -1px 0 #A84155;
 background: #D25068;
 border:1px solid #D25068;
 
 background-image:-webkit-linear-gradient(top, #F66C7B, #D25068);
 background-image:-moz-linear-gradient(top, #F66C7B, #D25068);
 background-image:-ms-linear-gradient(top, #F66C7B, #D25068);
 background-image:-o-linear-gradient(top, #F66C7B, #D25068);
 background-image:linear-gradient(to bottom, #F66C7B, #D25068);
 
 -webkit-border-radius:5px;
 -moz-border-radius:5px;
 border-radius:5px;
 
 -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
 -moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
 box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
}

.red:hover {
 background: #F66C7B;
 background-image:-webkit-linear-gradient(top, #D25068, #F66C7B);
 background-image:-moz-linear-gradient(top, #D25068, #F66C7B);
 background-image:-ms-linear-gradient(top, #D25068, #F66C7B);
 background-image:-o-linear-gradient(top, #D25068, #F66C7B);
 background-image:linear-gradient(top, #D25068, #F66C7B);
}

Embed code:<a href="Link" class="push_button red">Button name</a>

Button 11DownloadDownload
.button {display: inline-block;position: relative;padding: 10px 20px;-webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px;text-decoration: none!important;text-shadow: 1px 1px 0 rgba(255,255,255,0.4);font: 15px Calibri,Arial,sans-serif;white-space: nowrap;vertical-align: baseline;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png');background-position: bottom left;background-position: bottom left,top right,0 0,0 0;background-repeat: no-repeat;background-clip: border-box;-webkit-box-shadow: 0 0 1px #fff inset;-moz-box-shadow: 0 0 1px #fff inset;box-shadow: 0 0 1px #fff inset;-webkit-transition: background-position 1s;-moz-transition: background-position 1s;transition: background-position 1s;cursor: pointer;}
.button:hover {background-position: top left;background-position: top left,bottom right,0 0,0 0;}
.button:active {bottom: -1px;}
.button.big {font-size: 30px;}
.button.medium {font-size: 18px;}
.button.small {font-size: 13px;}
.blue.button {border: 1px solid #84acc3!important;color: #0f4b6d!important;background-color: #48b5f2;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(89,208,244,1) 0,rgba(89,208,244,0) 100px),-moz-linear-gradient(#4fbbf7,#3faeeb);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(89,208,244,1) ),to(rgba(89,208,244,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#4fbbf7),to(#3faeeb));}
.blue.button:hover {background-color: #63c7fe;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(109,217,250,1) 0,rgba(109,217,250,0) 100px),-moz-linear-gradient(#63c7fe,#58bef7);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(109,217,250,1) ),to(rgba(109,217,250,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#63c7fe),to(#58bef7));}
.green.button {border: 1px solid #96a37b!important;color: #345903!important;background-color: #79be1e;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(162,211,30,1) 0,rgba(162,211,30,0) 100px),-moz-linear-gradient(#82cc27,#74b317);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(162,211,30,1) ),to(rgba(162,211,30,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#82cc27),to(#74b317));}
.green.button:hover {background-color: #89d228;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(183,229,45,1) 0,rgba(183,229,45,0) 100px),-moz-linear-gradient(#90de31,#7fc01e);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(183,229,45,1) ),to(rgba(183,229,45,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#90de31),to(#7fc01e));}
.orange.button {border: 1px solid #bea280!important;color: #693e0a!important;background-color: #e38d27;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(232,189,45,1) 0,rgba(232,189,45,0) 100px),-moz-linear-gradient(#f1982f,#d4821f);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(232,189,45,1) ),to(rgba(232,189,45,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#f1982f),to(#d4821f));}
.orange.button:hover {background-color: #ec9732;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(241,192,52,1) 0,rgba(241,192,52,0) 100px),-moz-linear-gradient(#f9a746,#e18f2b);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(241,192,52,1) ),to(rgba(241,192,52,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#f9a746),to(#e18f2b));}
.gray.button {border: 1px solid #a5a5a5!important;color: #525252!important;background-color: #a9adb1;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(197,199,202,1) 0,rgba(197,199,202,0) 100px),-moz-linear-gradient(#c5c7ca,#92989c);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(197,199,202,1) ),to(rgba(197,199,202,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#c5c7ca),to(#92989c));}
.gray.button:hover {background-color: #b6bbc0;background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-moz-radial-gradient(center bottom,circle,rgba(202,205,208,1) 0,rgba(202,205,208,0) 100px),-moz-linear-gradient(#d1d3d6,#9fa5a9);background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi3uDI8RJIP60RfVGEmeoPRJoA1jIVV3MubBtxJlwZ1jMrmAupBccKgPkgxWo5yZYyhy84_PNkfH0nIfWtOKsDWKOsmBfXY1cUQD_6ZLN89FCpWqv9uCAk12uUO3M4H62c3PikRTqDJ38P/s144/button_bg.png') ,-webkit-gradient(radial,50% 100%,0,50% 100%,100,from(rgba(202,205,208,1) ),to(rgba(202,205,208,0) )),-webkit-gradient(linear,0% 0,0% 100%,from(#d1d3d6),to(#9fa5a9));}
Embed Code:<a class="button (big/small) (blue/green/orange/gray)" href="LINK">LINKNAME</a>


Button 12
.button2 {
    text-decoration: none;
    font: bold 13px Arial;
    display: block;
    margin: 20px auto;
    padding: 6px 14px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    width: 100px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
 -ms-transition: all 0.5s ease;
 -o-transition: all 0.5s ease;
    transition: all 0.5s ease;}

.button2:hover {
    -moz-border-radius: 5px;
    border-radius: 5px;}


.blue {
    color: #fff;
    background: #48C9FF;
    background: -webkit-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%);
    background: -moz-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%);
    background: -ms-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%);
    background: -o-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%);
    background: linear-gradient(to bottom, #48C9FF 0%, #2EA8E5 100%);
    text-shadow: #29a3cc 0 1px 3px;
    -webkit-box-shadow:
        inset 0 1px 0 #38bdf4,
        inset 0 2px 0 #7bdeff,
        0 1px 3px #777,
        0 0px 1px #ccc;
    -moz-box-shadow:
        inset 0 1px 0 #38bdf4,
        inset 0 2px 0 #7bdeff,
        0 1px 3px #777,
        0 0px 1px #ccc;
    box-shadow:
        inset 0 1px 0 #38bdf4,
        inset 0 2px 0 #7bdeff,
        0 1px 3px #777,
        0 0px 1px #ccc;}

.blue span {
    color: #217aa6;
    text-shadow: #78d2f0 0 1px 0;}​
Embed code:<a class="button2" href="Link">Button name</a>

If you find any problems with this post report a problem or request updates.

Sharing Is Caring

Create Free Video Sitemap (No Coding Required)



Videos are a great way to convey your ideas.Most bloggers use video sharing sites like youtube,metacafe to upload their videos and to embed it in their post.video sitemap tells Google exactly where, and what the video content is on your site. It helps Googlebots recognize video content, and display it in therelevant search results page..This is the only way to get video previews on search results for your site.
But creating a video sitemap can be very difficult and time consuming if you already have many videos on your site.But Complete PC Guide have found a solution for this.

Creating A Video Sitemap

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
 <url>
  <loc>YOUR VIDEO LANDING PAGE URL</loc>
  <video:video>
   <video:thumbnail_loc>VIDEO THUMBNAIL URL</video:thumbnail_loc>
   <video:title>VIDEO TITLE</video:title>
   <video:description>VIDEO DESCRIPTION</video:description>
   <video:content_loc>DIRECT URL TO VIDEO</video:content_loc>
   <video:player_loc allow_embed="yes" autoplay="ap=1">URL TO VIDEO ON A PLAYER</video:player_loc>
  </video:video>
 </url>
</urlset>



Create Video Sitemap Without Coding

If you don't know how to code this video sitemap or simply don't want to code then we have a solution.
Free Video Sitemap Generator Tool

How To Submit Your Video Sitemap?

  1. Copy the xml code and paste it in a new notepad file.
  2. Save the notepad file as videositemap.xml (Extension should be .xml)
  3. Then upload the sitemap file to your blog directory using FTP.
  4. Path yourdomainname.com/videositemap.xml
  5. Go to webmaster tools and sign in.
  6. Go to your site dashboard.
  7. Go to Crawl section and click Sitemaps.
  8. Add a sitemap from the top right button.
  9. Fill the url path.
  10. Click Submit.
If you are working to build traffic to your site then consider submitting a video sitemap.What do you think about video sitemaps?Is there any simple method than this?Tell us your thoughts in the comment sections!

Sharing Is Caring

7 Essential Things To Consider Before Choosing a Blogger Template


Tips to choose the best template for your site
Design plays a major role in improving site traffic.Many people uses blogger to create a free blog.Blogger doesn't have any premium templates like WordPress has.But you can change your blogger template to a custom template.There are many sites which provide free blogger templates.It is therefore very important to choose a perfect template for your blog.In this post you can learn how you can choose your perfect template.

7 Essential Things To Look  Before Choosing a Blogger Template

Design

Having a good design is very important!You should always make sure that you choose the right template for your niche.Imagine a tech site running a sports or news site layout.Therefore always choose a good template that suits your niche rather than what looks the best.
A good design is a mixture of all these

Compatibility

In order to make sure that your site looks same on all web browsers you need to run a template that is compatible on all web browsers.All users are not using the same browsers therefore to make your site look the same for all run a template which is compatible on all web browsers.You can perform cross browser testing here.

Responsive 

Now a days  people use different tech gadgets like smartphones, tablets,etc. for surfing internet.Different gadgets have different screen resolutions.With a responsive template you can run the same template on different screen resolutions without tampering the template look and feel.A responsive design automatically adapts to different resolutions.
Responsive Template

Search Engine Optimized

Templates should be optimized for search engines to improve your SEO.If the template is not optimized for search engine then you will see a significant drop in your traffic(Assuming your current template is SEO optimizes).Therefore always make sure about it before applying any changes.

Site Loading Time

Everyone hates slow websites.Slow website can increase the bounce rate of your website resulting in poor traffic.Too many scripts and CSS styles can also increase the page load time.There are different tools to check site load time.Google's Page Speed service analyzes the page load time and gives the recommendations to improve the site performance.
Tired of loading....?

Trusted Source

Downloading templates from trusted sources is very important.Otherwise there is chance of having malicious scripts and codes in your templates.Templates from non trusted sources may contain low quality backlinks and redirects.In my personal experience I have once seen a huge drop in my traffic due to a redirect link in the template.Therefore always go for trusted sources.
Identify a trusted source by the number of templates,registered domains,no.of followers or feed subscribers,alexa rank,google page rank,ssl verified(https),etc..

Premium Templates

This is an optional point to consider.Premium templates will be optimized for search engine which means they won't have any malicious scripts or codes in them.They will provide a much better flexibility for you to easily edit the template.Premium templates will also make use of the latest coding languages like HTML5,CSS3,etc. and other latest services.( Create a free HTML 5 website )
Premium templates make use of latest technology


Leave a comment about the tip that is most important to you when considering a good template and tell why is it so!
If you have any doubts or questions please feel free to ask via the contact us page.

Sharing Is Caring

How To Make Money Online?


Make money online
Everyone likes to make money.If you are an internet surfer then why not make some money online by doing part time jobs.There are different ways of making money online.One of the best and growing method is by displaying ads on your site.So if don't have a site create a free site now.The different ways of making money online are through displaying ads,affiliate marketing,offering help,text link advertising,etc.In this post I will explain these methods in more detailed so that you can decide what to choose for monetizing your blog.

Displaying Ads

This is one of the most popular method used by bloggers.There are many ad networks like Adsense,Chitika,media.net{Yahoo | Bing network},etc.These will allow you to place different ads to your site.The ad network will display the most relevant ads for your site.You earn money either for each click or for every 1000 impressions for your ad in this type of network.Getting approved with Google Adsense can be difficult with no unique content.Only apply for ad networks like this once you have a good amount of visitors per day.Otherwise you will end up optimizing your ads rather than producing unique content.You can also have direct advertising for your site with sites like buysellads.You get  paid for displaying the ad for a specific duration by selling your ad space directly to advertisers.

Affiliate Marketing


How affiliate marketing works?

Affiliate Marketing also means to display ads on your site.But there is a change on how you get paid.You can easily display the company's ads on your site without any site requirements.For example,consider that you are displaying ads of amazon on your site.In this case you will get paid only when a user purchases an item through the ad link.Here there is no CPC or CPM.You get a commission for each sale of the product.
Check this link to learn more about amazon affiliate.There are a lot of sites that offer affiliate marketing.Almost all online stores and web hosting companies has its affiliate program.

Text Link Advertising

Infolinks | A text link advertising network
These are link advertising which means keywords in your article are converted to links that redirects to the advertisers website.These type of ad networks pay either for each click on the link or a fixed amount per month.There are many of these networks such as Viglink,Skimlink,etc.You cam read more about these ad networks and how they pays here.

Get Paid To Offer Your Help Or Assistance

Sites like  Fiverr
The first three methods explained in this post can be done only if you have a site.But this is quite different from other methods.You might not have heard about this way of making money online.You get an amount for offering your assistance.For example" I say I will edit your blog for 5$ ".When someone is interested in this deal they pay me and that is how you earn.It can be of any assistance or help.Some of the sites that allows you to do this are Fiverr,GigBucks,Zeerk,SEOClerks,etc.Check out other top sites like this here.

Have I missed something?What to add further in this post?Tell us in the comments.Out of these what you likes the most and why?Leave your valuable comments below.
                                                       Thank You! Keep Visiting !

Sharing Is Caring

Top 5 Ways To Customize YouTube Embeds


Customize Youtube Embed Player
YouTube is a growing platform for video shares.With its free services many people own a youtube channel.Videos are great way to learn something than by just reading.Many blogger uses youtube to share their videos on youtube and then embed the video in their post.But by default youtube has a default style for embedded player.In this post I will explain you thedifferent methods of customizing the youtube embedded player.You can also learn to add light version of the video player to decrease page load time.

How To find video ID?
The video ID can be located from the URL of the video.For example in this URL http://www.youtube.com/watch?v=85GqVYeyn18 the video ID is 85GqVYeyn18

Different Customized Players

Style 1 : Default Player

The default player can be easily embedded into your webpage.The code for the default player is given below.
<iframe width="420" height="315" src="//www.youtube.com/embed/Video ID" frameborder="0" allowfullscreen></iframe>

Replace the video ID with your video ID.

Style 2 : Only Thumbnail + Circle Play Button

This is a light weight version of the player.This embed player doesn't have the button panel and id chromeless.This player has a thumbnail preview with a circle play button at the center.This is a quick way of loading your webpage.This code can reduce your page size by over 300kb.We highly recommend to use this.
To add an embedded player like this use the below code.
<div class="youtube" id="Your Video ID" style="width: 320px; height: 180px;"></div>

A sample video player of the above code.

Style 3 : Resize Player Option

If you want to provide an option to change your video player size embedded in a post you can use the below code.
<style type="text/css">
      #videoDiv {
        margin-right: 3px;
      }
      #videoInfo {
        margin-left: 3px;
      }
    </style>
    <script src="//www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("swfobject", "2.1");
    </script>   
    <script type="text/javascript">
      /**
       * Resizing the player in JavaScript.
       */
     
      // Make the player small.
      function smallPlayer() {
        resizePlayer(480, 295);
      }
     
      // Set the player back to normal.
      function normalPlayer() {
        resizePlayer(560, 340);
      }
     
      // Make the player big.
      function largePlayer() {
        resizePlayer(640, 385);
      }
     
      // Set the loaded player to a specific height and width.
      function resizePlayer(width, height) {
        var playerObj = document.getElementById("ytPlayer");
        playerObj.height = height;
        playerObj.width = width;
      }
     
      // The "main method" of this sample. Called when someone clicks "Run".
      function loadPlayer() {
        // The video to load
        var videoID = "YOUR VIDEO ID"
        // Lets Flash from another domain call JavaScript
        var params = { allowScriptAccess: "always" };
        // The element id of the Flash embed
        var atts = { id: "ytPlayer" };
        // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
        swfobject.embedSWF("http://www.youtube.com/v/" + videoID +
                           "?version=3&enablejsapi=1&playerapiid=player1",
                           "videoDiv", "560", "340", "9", null, null, params, atts);
      }
      function _run() {
        loadPlayer();
      }
      google.setOnLoadCallback(_run);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <table>
    <tr>
    <td><div id="videoDiv">Loading...</div></td>
    <td valign="top">
      <div id="videoInfo">
  <a href="javascript:smallPlayer()">Small Player</a>
  <a href="javascript:normalPlayer()">Normal Player</a>
  <a href="javascript:largePlayer()">Large Player</a>
      </div>
    </td></tr>
    </table>
  </body>
</html>
 Replace the video ID with your video ID.Change the size of  small player,normal player and big player by changing the values inside resizePlayer(***, ***) with your desired width and height respectively.

Style 4 : Change The Playing Video

If you want to embed a video player that has an option to change the playing video use the code below.
 <style type="text/css">
      #videoDiv { 
        margin-right: 3px;
      }
      #videoInfo {
        margin-left: 3px;
      }
    </style>
    <script src="//www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("swfobject", "2.1");
    </script>    
    <script type="text/javascript">
      /*
       * Change out the video that is playing
       */
      
      // Update a particular HTML element with a new value
      function updateHTML(elmId, value) {
        document.getElementById(elmId).innerHTML = value;
      }
      
      // Loads the selected video into the player.
      function loadVideo() {
        var selectBox = document.getElementById("videoSelection");
        var videoID = selectBox.options[selectBox.selectedIndex].value
        
        if(ytplayer) {
          ytplayer.loadVideoById(videoID);
        }
      }
      
      // This function is called when an error is thrown by the player
      function onPlayerError(errorCode) {
        alert("An error occured of type:" + errorCode);
      }
      
      // This function is automatically called by the player once it loads
      function onYouTubePlayerReady(playerId) {
        ytplayer = document.getElementById("ytPlayer");
        ytplayer.addEventListener("onError", "onPlayerError");
      }
      
      // The "main method" of this sample. Called when someone clicks "Run".
      function loadPlayer() {
        // The video to load
        var videoID = "ylLzyHk54Z0"
        // Lets Flash from another domain call JavaScript
        var params = { allowScriptAccess: "always" };
        // The element id of the Flash embed
        var atts = { id: "ytPlayer" };
        // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
        swfobject.embedSWF("http://www.youtube.com/v/" + videoID + 
                           "?version=3&enablejsapi=1&playerapiid=player1", 
                           "videoDiv", "480", "295", "9", null, null, params, atts);
      }
      function _run() {
        loadPlayer();
      }
      google.setOnLoadCallback(_run);
    </script>
  </head>
  <body style="font-family: Arial;border: 0 none;">
    <table>
    <tr>
    <td><div id="videoDiv">Loading...</div></td>
    <td valign="top">
      <div id="videoControls">
        <p>Select a video to load:</p>
        <select id="videoSelection" onchange="loadVideo();">
          <option value="
Video ID" selected>Video Title </option>
          <option value=
Video ID "> Video Title </option>
          <option value=
Video ID "> Video Title </option>
        </select>
      </div>
    </td></tr>
    </table>
  Change the default video to load by replacing the video ID with your video ID in the video to load section.
To add different options change the video ID and the video title at the end of the code.The below is demonstration of the code.



Loading...

Select a video to load:

Style 5 : YouTube Player Generator With Custom Options


If you want to add a different styled player then use the Youtube Player Generator.It offers a variety of custom options.

How can we improve this post?Which player you liked the most.Tell us your opinion in comments.

Sharing Is Caring