Remove blog Header and Use Image Instead

Spread it!

Share

Email This

Sponsored Links

Sometimes using blog header may not look your blog cool and you may like to use a cool header image in place of boring default header.If so then bloganol brings you the cool blogger hacks that removes blog header and you can use a cool header images instead of blog header.

First of all goto Blogger Edit Html Page and Search for the following line of code.

#header-wrapper {width:660px;margin:0 auto 10px;border:1px solid $bordercolor;}

Now replace the above code with the following code in your template.

#header-wrapper {width:800px;margin:0 auto 10px;border:1px solid $bordercolor;display:none;}

The above code hides your blog header.Now to use a cool image in place of header search for the following code in your template.

<div id='header-wrapper'><b:section class='header' id='header' maxwidgets='1' showaddelement='no'><b:widget id='Header1' locked='true' title='Bloganol Demo Blog (Header)' type='Header'/></b:section></div>

Now paste the following code just after the above code.

<a href="URL_OF_UR_BLOG"><img src="URL_OF_THE_IMAGE" alt="Home" /></a>

Now see the demo below.

Before

After

Consider to Subscribe to our RSS feed or Follow us at Twitter or Join our Facebook Fan Page.Enter your Email below to subscribe to our updates via Email.

Similar Posts

• Add new layout below Header in Blogger
• How to create section to add Gadgets in your header section?
• 30 cool Blog Header background images
• Create Table of Contents Page for your blog
• Create Table of Contents in Blogger

Article by Dinesh Dhakal

Dinesh has written 288 awesome articles for us. Dinesh Dhakal(Deineshd) is the Admin of this blog.He is from Kathmandu, Nepal who is blogging since complete 4 years.You can catch him on twitter at Twitter.com/deineshd and in Facebook at Facebook.com/deineshd.