DbAppWeb.com

Menu
  • Home
  • Linux
  • HP-UX
  • macOS
  • Windows
  • Web Servers
  • App Servers
  • Storage

How to Split or Divide Blogger Header in Two Parts

June 9, 2016 DbAppWeb Admin
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.

    Split Blogger Header in Two Parts

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?

Share this:

  • Click to share on Twitter (Opens in new window)
  • Click to share on Facebook (Opens in new window)
  • Click to share on LinkedIn (Opens in new window)
  • Click to share on Telegram (Opens in new window)
  • Click to share on WhatsApp (Opens in new window)
Prev Article
Next Article
Tags:Blogger

No Responses

  1. Pingback: How to reduce space between gadgets in Blogger? - DbAppWeb.com

Leave a Reply Cancel Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

  • Popular
  • Recent

Categories

  • Android (2)
  • Blogger (16)
  • Domain and Hosting (1)
  • Hardware Issues (7)
  • HP-UX (55)
  • HPE Data Protector (9)
  • IBM Lotus Notes (2)
  • IBM WebSphere Application Server (16)
  • Internet Tips & Tricks (15)
  • iOS (8)
  • JBoss/WildFly Application Server (2)
  • Linux (76)
  • macOS (15)
  • Microsoft Windows (31)
  • News and Updates (11)
  • Oracle Database (5)
  • SSL/TLS (1)
  • Storage Servers (23)
  • Tools/Softwares (1)
  • VMware ESXi (17)
  • Web Servers (14)
  • WordPress (5)

Archives

DbAppWeb.com

Solution of Database, Application and Web Server Problems

About DbAppWeb.com

One Stop Solution for Database Server, Application Server and Web Server Problems.

Subscribe to Blog via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

DbAppWeb on Social Media

Copyright © 2025 DbAppWeb.com
Terms and Conditions   Theme by MyThemeShop.com