Subheading stylish trick

Add This To Del.icio.us Share on Facebook StumbleUpon This Add to Technorati Digg This

Heading is an important part of the blog post. When you are writing a new post there will be many headings. Most of the bloggers use the heading style same as the default template style. That is not a bad thing. But when you are writing a sub heading in the post, it is better to add any other different style heading i.e, a customized heading.

Actually there are different types of headings available.While writing a new post there are heading options which are Heading,Subheading and Minor Heading. But most of the blogger fail to notice this option. Nevertheless this ignorance do not create much difference apart from the size and the heading tags like h2, h3 and h4.. There is no other difference that you will see. Here I am showing two different
style of subheading for blogger.

1. Rounded edge subheading

2. Rounded edge with shadow

For adding one of above customized sub heading to your blog post follow these steps.

#. Go to blogger dashboard

#. Design and select edit HTML

#. Expand widget templates.

#. Search for ]]></b:skin> 

#. And paste the code above it.

Code For Rounded Edge Sub Heading

This is what I am using. It is simple and looks very neat. Copy the code and paste it 

.post h3 {
color:#3d85c6;
border:1px solid #BDBDBD;
-moz-border-radius: 10px;
border-radius: 10px;
padding:4px;
font-size: 12pt;
}

Code For Rounded Edge With Shadow 

This is another customized heading style same as mentioned above but it  comes with shadow. Copy the code and paste it.

.post h3 {
color:#3d85c6;
border:1px solid #BDBDBD;
-moz-border-radius: 10px;
border-radius: 10px;
padding:3px;
font-size: 12pt;
-webkit-box-shadow: 0 8px 6px -6px black;
-moz-box-shadow: 0 8px 6px -6px black;
box-shadow: 0 8px 6px -6px black;}

After pasting the code in the template, in order to get the appropriate effects in the post, choose a heading and click the sub heading option from above. Preview the settings to view the effects.

You can change the color by replacing the code #3d85c6 and pasting any HTML color codes. Let the colors match your blog template.

For Further Reading,