You can split the blogger header into two parts, process is simple as given below:
- In your Blogger Dashboard go to Template >> Edit HTML
- Search for text <b:section class=’header’ and add the below code after the closing </b:section>.
<b:section id='header-right' showaddelement='yes'></b:section> <div style='clear: both;'/>
- Search for ]]></b:skin> and add the below CSS code just above this text to define the width of both headers.
#header, body#layout #header {width:33%;display:inline-block;float:left;} #header-right, body#layout #header-right {width:65%;display:inline-block;float:right;padding:0px;} #header-right .widget {margin:0;}
- You can adjust the width of the headers which suits you.
- Now you can see in the Layout that the header has been split into two parts Header and header-right.
Last Updated: May 12, 2020
Related Posts
- How To Change Widget Title Background On Blogger
- How to Add Adsense Ads Between Blog Post and Comment Box in Blogger
- How to Enable Search Description for Blogger and Blog Posts
- How to Make your Blogger Blog Template to fit any Screen Resolution
- How to reduce space between header and pagelist widgets in blogger
- Remove Empty Space Left on Top After Removing Navbar in Blogger
- Show more than 200 comments on Blogger Page or Post
- How To Show Post Title Before Blog Title in Blogger?
- How to add a gadget above header in blogger?
- How to reduce space above the Title in Blogger
- How to reduce space between Title and Description in Blogger
- How to customise Read More link in blogger
- How to reduce space between gadgets in Blogger?
- How to add Recent Posts Slider with images for Blogger?
No Responses