![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKDiKgnyISRrldQV8-jfK6CRVSDc3B2qfwjpBf4Wg9qcoEFTizFb8aEEvZk_LZOP1VnBTFgSeDMaJclJSngbZBsnUYQQCuVnH6QgciRZkiFZuFaCQ3wEXOGE75OYvDPJHZ8XWT9Kc9J3nX/s1600/Split+Blogger+Header.jpg)
Step 1
- Go to Blogger Dashboard
- Click On Template >> Edit HTML >> Proceed
- Make Sure That Expand Widget Template checkbox is UNCHECKED
- Now find below code there
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='My Test Blog (Header)' type='Header'/>
</b:section>
- Insert Following Code Right Under (after) It.
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>
- Finally Codes Should Like Like This:
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Blogger Sentral Widget Showcase (Header)' type='Header'/>
</b:section>
<b:section id='header-right' showaddelement='yes'/>
<div style='clear: both;'/>
Step 2
- Now Find ]]></b:skin>
- Paste Below Code Above ]]></b:skin>
#header, body#layout #header {width:45%;display:inline-block;float:left;}
#header-right, body#layout #header-right {width:40%;display:inline-block;float:right;padding:15px;}
#header-right .widget {margin:0;}
- You can easily see highlighted text in code.Adjust Both header width according to your choice.
- After Finishing All Steps Click On Save Template Button And Enjoy Your Second Header.
Adding Widget In Header
- Go to Blogger Dashboard
- Click On Layout Tab
- There you will find add gadget option next to your blogger header just click on it and add any widget you want to add.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO2-XEq5aXTE7UuJ6rtIKwDmVc0-e5YQgRsuev28hZLw8Se058l7ol5Jbbh3DGKYVcp7s-SU75uFC8_hQ58FS-0z1V1MZqjYwxtTjJYHAf9LkCFdTDJ7-XpCj6K6B5gn8Vx274o0gOTB6Q/s640/header+2.png)
No comments:
Post a Comment