Change Header Size in Blogger

By default blogger gives the larger height in the header and when we adds the Description along with Title then it’ll takes some extra space for it and makes even more larger header. But Larger header height looks ugly and for professional image we need to change the header size. We can do the changes in HTML to modify the header size by removing the extra padding at the Title. Default template having the extra padding of 22px along with the Title. So it’s important to minimize the extra pad space.

Move to the Blogger Dashboard. Here you can Edit the Existing css code inside HTML but it is crucial to perform the Backup operation before editing. So we’ll not do in that way. Let’s overwrite the existing css. Previously we’ve seen the css styling with Pager Links and Read-more links. Inside the Blogger dashboard click on Template> Customize> Advanced> Add CSS. Here on the right side box. add the below CSS code.

.header-inner .Header .titlewrapper {
  padding:22px 30px;
}

Here modify the padding according to your choice. By default its 22px and 30px. As you modify the code you’ll see the effects in screen below the css box. Select the header style which best fits to your entire blogger layout. Apply the changes and You are done !

Thanks.

Leave a Comment