What’s Hot


As you know very well that we are aimed at educating you about friendly SEO Tips and Techniques. The strategies stated here can assist you greatly to raise the ranking of your blog or website and attract more and more online traffic.
 


In this article I am going to tell you about some best practices for the SEO of your blog or website.

1. Keywords and Phrases:

From time and again we have been telling you how important and vital the keywords and phrases are in SEO. Without selection of proper and targeted Keywords and Phrases your efforts of attracting targeted viewer ship or potential customers and bringing your site on top positions in search engines go futile. Select proper keywords and phrases according to the title and topic of your site. Moreover use less common and unique keywords and phrases. The keywords and phrases having low searches will have better results. A good research in this regard will bear good results.

2. The Frequency of Keywords and Phrases:

Frequency of keywords and phrases in your content is very important. Your keyword phrases should be added in title as well in your text. However remember that targeted keywords should appear in the text a few times, but not too frequently. Use of keywords too much is identified by Google as spam. So, keyword stuffing may have worst effects on your website. The best technique is to use the keyword or phrase in title and then in the first and last paragraphs of your text. If you are intended to use it even more then you may use it twice in between and this is sufficient. You can even check the density of your keywords using keyword density tool.

3. Content

There is no doubt in saying that content is the life-blood of your website or blog. A great many depends upon it. The visitors come up only for the content and other attractions are secondary. So, the content must be of high quality, free of errors and improvised so that more and more users can benefit from it and even recommend it to potential customers. The unique and excellent content has unique and excellent results. Google evaluates the usefulness and quality of written content through effective ways. Use of keywords must be scarce and if there is too much use of keywords then you may use synonyms.

4.Content Volume Writing Technique

Google as well as other search engines boost the high quality content. They consider websites that continuously post new and more content. You need to keep it in mind and set a goal how much content you will add to your blog or website daily. The sporadic posting of content has very less utility. It is better if you add two to three articles daily.

The second thing which is important in this regard is that you must split your long articles into small and easily understandable paragraphs. If possible write each separate thing in a separate point form. Some articles are long because of their nature but very lengthy paragraphs and too many complex sentences drive the interest of reader away. The best strategy in this situation is to use headings and write in small paragraphs. Also try to squeeze your articles within 500 words but without losing the essence of the topic.

5. Use of H1 tags on your Page

Make sure that the words in the title with H1 tag are also used in the text because when you use H1 tag on your page the search engine interprets it as the main title of your page. It is better to use H2 and H3 for other headings in your content.

6. Disadvantage of Flash

Websites using flash are annoying and frustrating for the users because it takes ages to load. Search engines also find difficulty in reading flash files. So, flash won’t provide you any advantage rather it is a disadvantage. It is therefore better to use HTML because such sites are more user-friendly.

I hope these tips will help you get some positive results in SEO of your website or blog.

Six Tips for Best SEO Results


As you know very well that we are aimed at educating you about friendly SEO Tips and Techniques. The strategies stated here can assist you greatly to raise the ranking of your blog or website and attract more and more online traffic.
 


In this article I am going to tell you about some best practices for the SEO of your blog or website.

1. Keywords and Phrases:

From time and again we have been telling you how important and vital the keywords and phrases are in SEO. Without selection of proper and targeted Keywords and Phrases your efforts of attracting targeted viewer ship or potential customers and bringing your site on top positions in search engines go futile. Select proper keywords and phrases according to the title and topic of your site. Moreover use less common and unique keywords and phrases. The keywords and phrases having low searches will have better results. A good research in this regard will bear good results.

2. The Frequency of Keywords and Phrases:

Frequency of keywords and phrases in your content is very important. Your keyword phrases should be added in title as well in your text. However remember that targeted keywords should appear in the text a few times, but not too frequently. Use of keywords too much is identified by Google as spam. So, keyword stuffing may have worst effects on your website. The best technique is to use the keyword or phrase in title and then in the first and last paragraphs of your text. If you are intended to use it even more then you may use it twice in between and this is sufficient. You can even check the density of your keywords using keyword density tool.

3. Content

There is no doubt in saying that content is the life-blood of your website or blog. A great many depends upon it. The visitors come up only for the content and other attractions are secondary. So, the content must be of high quality, free of errors and improvised so that more and more users can benefit from it and even recommend it to potential customers. The unique and excellent content has unique and excellent results. Google evaluates the usefulness and quality of written content through effective ways. Use of keywords must be scarce and if there is too much use of keywords then you may use synonyms.

4.Content Volume Writing Technique

Google as well as other search engines boost the high quality content. They consider websites that continuously post new and more content. You need to keep it in mind and set a goal how much content you will add to your blog or website daily. The sporadic posting of content has very less utility. It is better if you add two to three articles daily.

The second thing which is important in this regard is that you must split your long articles into small and easily understandable paragraphs. If possible write each separate thing in a separate point form. Some articles are long because of their nature but very lengthy paragraphs and too many complex sentences drive the interest of reader away. The best strategy in this situation is to use headings and write in small paragraphs. Also try to squeeze your articles within 500 words but without losing the essence of the topic.

5. Use of H1 tags on your Page

Make sure that the words in the title with H1 tag are also used in the text because when you use H1 tag on your page the search engine interprets it as the main title of your page. It is better to use H2 and H3 for other headings in your content.

6. Disadvantage of Flash

Websites using flash are annoying and frustrating for the users because it takes ages to load. Search engines also find difficulty in reading flash files. So, flash won’t provide you any advantage rather it is a disadvantage. It is therefore better to use HTML because such sites are more user-friendly.

I hope these tips will help you get some positive results in SEO of your website or blog.





There are some Google Plus widgets for your Cabanova online site. The aforementioned may need you to drop in your Google+ Page ID so as to permit the provision to enter client qualified data for example the amount of devotees you have.

See the following Google+ Page with Badge.

Just Follow My Instructions And Easy To Know Find Your Page ID of Google+,
  1. Log In to your Gmail or Google+ account
  2. Click On The Following Pages Icon,



3. Select Your Page If You Have Multiples
4. When You Look At The Top Of Address Bar You Will Your Page ID Look Like Below Picture


    5. In The Red Box Your Google+ Page ID.
    6. That's It You're Done And You Found Your Page ID.


If you have any problem after these instructions just comment here below in box. 

6Steps How To Find Google Plus Page ID (Google+)




There are some Google Plus widgets for your Cabanova online site. The aforementioned may need you to drop in your Google+ Page ID so as to permit the provision to enter client qualified data for example the amount of devotees you have.

See the following Google+ Page with Badge.

Just Follow My Instructions And Easy To Know Find Your Page ID of Google+,
  1. Log In to your Gmail or Google+ account
  2. Click On The Following Pages Icon,



3. Select Your Page If You Have Multiples
4. When You Look At The Top Of Address Bar You Will Your Page ID Look Like Below Picture


    5. In The Red Box Your Google+ Page ID.
    6. That's It You're Done And You Found Your Page ID.


If you have any problem after these instructions just comment here below in box. 

How to add facebook like button with counter in blogger template ? ...

1. Get Your App ID by creating application in Facebook Developers

Example of Your App ID : 183470581671QRS

2. Login to blogger with your ID

3. Click design

4. Click edit html

5. Click download full template

6. Tick expand widget template

7. Find code below :

<div class='post-header-line-1'/>

press (Ctrl+F) to easily find.

7. Copy your facebook like button code and paste it just below the above code.

NOTE : If you can not find <div class='post-header-line-1'/> in your blogger template, paste your facebook share button code just before <data:post.body/>

1. Button Count


CODE :
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

<fb:like action='like' colorscheme='light' expr:href='data:Post.url'
layout='button_count' show_faces='true' width='500'/>
</b:if>


2. Box Count


CODE :
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

<fb:like action='like' colorscheme='light' expr:href='data:Post.url'
layout='box_count' show_faces='true' width='500'/>
</b:if>


3. Standard


CODE :
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

<fb:like action='like' colorscheme='light' expr:href='data:Post.url'
layout='standard' show_faces='true' width='500'/>
</b:if>

8. Click save template and done.

Add Facebook Like Button with Counter in Blogger

How to add facebook like button with counter in blogger template ? ...

1. Get Your App ID by creating application in Facebook Developers

Example of Your App ID : 183470581671QRS

2. Login to blogger with your ID

3. Click design

4. Click edit html

5. Click download full template

6. Tick expand widget template

7. Find code below :

<div class='post-header-line-1'/>

press (Ctrl+F) to easily find.

7. Copy your facebook like button code and paste it just below the above code.

NOTE : If you can not find <div class='post-header-line-1'/> in your blogger template, paste your facebook share button code just before <data:post.body/>

1. Button Count


CODE :
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

<fb:like action='like' colorscheme='light' expr:href='data:Post.url'
layout='button_count' show_faces='true' width='500'/>
</b:if>


2. Box Count


CODE :
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

<fb:like action='like' colorscheme='light' expr:href='data:Post.url'
layout='box_count' show_faces='true' width='500'/>
</b:if>


3. Standard


CODE :
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

<fb:like action='like' colorscheme='light' expr:href='data:Post.url'
layout='standard' show_faces='true' width='500'/>
</b:if>

8. Click save template and done.



1. Log in to blogger account and Click drop down.

blog-post-option
2. Now select "Template" Like Below.

Select-template

3. Now you can see Live on blog, Click EDIT HTML Button"

4. Now click Proceed button.
   
5. Find this tag by using Ctrl+F    ]]></b:skin>

6. Paste below code Before ]]></b:skin> tag
 .button{
font:15px Calibri, Arial, sans-serif;
text-shadow:1px 1px 0 rgba(255,255,255,0.4);
text-decoration:none !important;
white-space:nowrap;
display:inline-block;
vertical-align:baseline;
position:relative;
cursor:pointer;
padding:10px 20px;
background-repeat:no-repeat;
background-position:bottom left;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png');
background-position:bottom left, top right, 0 0, 0 0;
background-clip:border-box;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
-moz-box-shadow:0 0 1px #fff inset;
-webkit-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;
}
.button:hover{
background-position:top left;
background-position:top left, bottom right, 0 0, 0 0;
}
.button:active{
bottom:-1px;
}
/* The three buttons sizes */
.button.big { font-size:30px;}
.button.medium { font-size:18px;}
.button.small { font-size:13px;}
/* BlueButton */
.blue.button{
color:#0f4b6d !important;
border:1px solid #84acc3 !important;
background-color: #48b5f2;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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 */
.green.button{
color:#345903 !important;
border:1px solid #96a37b !important;
background-color: #79be1e;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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 */
.orange.button{
color:#693e0a !important;
border:1px solid #bea280 !important;
background-color: #e38d27;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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));
}
/* Orange Button */
.gray.button{
color:#525252 !important;
border:1px solid #a5a5a5 !important;
background-color: #a9adb1;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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));
}



7. Go to blogger and click Layout

8. Click Add Gadget and select 'HTML/Javascript

9. Paste below code.

(You can use this code anywhere in your post.)

<a class="button big blue" href="Your Link" target="_blank">Live Demo</a>

<a class="button big orange" href="Your Link" target="_blank">Live Demo</a>

<a class="button big green" href="Your Link" target="_blank">Live Demo</a>

<a class="button big gray" href="Your Link" target="_blank">Live Demo</a>
Replace  with your links.

10. Now save your HTML/Javascript'.

    You are done...

Add Attractive Animated CSS Buttons For Blogger

1. Log in to blogger account and Click drop down.

blog-post-option
2. Now select "Template" Like Below.

Select-template

3. Now you can see Live on blog, Click EDIT HTML Button"

4. Now click Proceed button.
   
5. Find this tag by using Ctrl+F    ]]></b:skin>

6. Paste below code Before ]]></b:skin> tag
 .button{
font:15px Calibri, Arial, sans-serif;
text-shadow:1px 1px 0 rgba(255,255,255,0.4);
text-decoration:none !important;
white-space:nowrap;
display:inline-block;
vertical-align:baseline;
position:relative;
cursor:pointer;
padding:10px 20px;
background-repeat:no-repeat;
background-position:bottom left;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png');
background-position:bottom left, top right, 0 0, 0 0;
background-clip:border-box;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
-moz-box-shadow:0 0 1px #fff inset;
-webkit-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;
}
.button:hover{
background-position:top left;
background-position:top left, bottom right, 0 0, 0 0;
}
.button:active{
bottom:-1px;
}
/* The three buttons sizes */
.button.big { font-size:30px;}
.button.medium { font-size:18px;}
.button.small { font-size:13px;}
/* BlueButton */
.blue.button{
color:#0f4b6d !important;
border:1px solid #84acc3 !important;
background-color: #48b5f2;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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 */
.green.button{
color:#345903 !important;
border:1px solid #96a37b !important;
background-color: #79be1e;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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 */
.orange.button{
color:#693e0a !important;
border:1px solid #bea280 !important;
background-color: #e38d27;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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));
}
/* Orange Button */
.gray.button{
color:#525252 !important;
border:1px solid #a5a5a5 !important;
background-color: #a9adb1;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/s144/button_bg.png'), url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTGJY2U2B4UJOc-XVdyM_M19zh0JxkITR37FkwUxmTeStIrl0EerARLhF0ceTNoEFq_1-2GKuZuI9-00017K49R_pUj3ga0jXbBjZb9eWfU8KYPEl0CNzXUFjzK1aqtazanZOF9pXhQa4/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));
}



7. Go to blogger and click Layout

8. Click Add Gadget and select 'HTML/Javascript

9. Paste below code.

(You can use this code anywhere in your post.)

<a class="button big blue" href="Your Link" target="_blank">Live Demo</a>

<a class="button big orange" href="Your Link" target="_blank">Live Demo</a>

<a class="button big green" href="Your Link" target="_blank">Live Demo</a>

<a class="button big gray" href="Your Link" target="_blank">Live Demo</a>
Replace  with your links.

10. Now save your HTML/Javascript'.

    You are done...