The Default Title Theme for blogger is similar for every blog, But everyone likes to be different from other. The post title/Heading is very first thing that visitors is going to observe about your blog. So, it is very necessary and needy to customize your title of post and add some stylish title to it. Here, I am going to tell you how to add stylish title to blogger post.
It looks very different from default one. So, I recommend it to apply it on your blog. and for Applying stylish title on your blogger post follow the below Steps.
STEPS
1. Go To
Blogger | Dashboard
2. Now, Go to
Edit HTML
3. Find
]]></b:skin> by using CTRL+F
4. Paste the code.
CODE
.post h2 {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAPThbwTBwHiHDger7QvIMoGfjEHYOdCpAwceRE9HFesNGDwDhgMur9puKrJXkTvXfK6YN3MJKOKALSDw-2WCB9tl14N8grpKmueMvkuDuBfhRgWjExl7WeTL8LHsmICxcgr8pdyWlWjk/s1600/h3.png") no-repeat 4px center transparent;
font-size: 20px;
font-family:Arial,Helvetica,Sans-serif;
font-weight:normal;
padding: 3px 10px 3px 80px;
color: #0274be;
border: 3px solid #5bb5f0;
text-shadow: 0 1px 0 #CCC;
-moz-border-radius: 60px;
-webkit-border-radius: 60px;
border-radius: 60px;
-moz-box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
-webkit-box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
margin: 15px 3px;
text-transform: uppercase;
line-height: 1.3;
}
CUSTOMIZATION
1. If you want it to add this stylish title to subheading or minor heading, just replace h2 with h3 or h4 resp.
2. If you want to change font of title then replace font-family:Arial,Helvetica,Sans-serif; with any Font Family.
.post h2
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAPThbwTBwHiHDger7QvIMoGfjEHYOdCpAwceRE9HFesNGDwDhgMur9puKrJXkTvXfK6YN3MJKOKALSDw-2WCB9tl14N8grpKmueMvkuDuBfhRgWjExl7WeTL8LHsmICxcgr8pdyWlWjk/s1600/h3.png") no-repeat 4px center transparent;
font-size: 20px;
font-family: Oswald;
font-weight:normal;
padding: 3px 10px 3px 80px;
color: #0274be;
border: 3px solid #5bb5f0;
text-shadow: 0 1px 0 #CCC;
-moz-border-radius: 60px;
-webkit-border-radius: 60px;
border-radius: 60px;
-moz-box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
-webkit-box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
margin: 15px 3px;
text-transform: uppercase;
line-height: 1.3;
}
Read more at http://haseebnet.blogspot.com/2012/11/stylish-heading-style-for-blogger.html#vGHCJbXrsAZTwKrj.99
.post h2 {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAPThbwTBwHiHDger7QvIMoGfjEHYOdCpAwceRE9HFesNGDwDhgMur9puKrJXkTvXfK6YN3MJKOKALSDw-2WCB9tl14N8grpKmueMvkuDuBfhRgWjExl7WeTL8LHsmICxcgr8pdyWlWjk/s1600/h3.png") no-repeat 4px center transparent;
font-size: 20px;
font-family: Oswald;
font-weight:normal;
padding: 3px 10px 3px 80px;
color: #0274be;
border: 3px solid #5bb5f0;
text-shadow: 0 1px 0 #CCC;
-moz-border-radius: 60px;
-webkit-border-radius: 60px;
border-radius: 60px;
-moz-box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
-webkit-box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
box-shadow: 0 1px 3px #5bb5f0, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;
margin: 15px 3px;
text-transform: uppercase;
line-height: 1.3;
}
Read more at http://haseebnet.blogspot.com/2012/11/stylish-heading-style-for-blogger.html#vGHCJbXrsAZTwKrj.99
This post is so helpfull and informative.Keep updating more information...
ReplyDeleteGraphic Designing in Mumbai
Graphic Design courses in Ahmedabad
Graphic Designers in Kochi
Graphic Design institute in Trivandrum
Graphic Designing in Kolkata
This post is so useful and informative. Keep updating with more information.....
ReplyDeleteSimple Hacking
How To Be An Ethical Hacker