- Share This Post
- 0
- submit
- 6
-
Sparkle (0)
Continuing last week’s discussion, How do I change the banner on my blog template?, in this post we’ll talk about how to swap out the banner on your Blogger blog with minimal effort.
If you’ve recently signed up for Blogger.com, the free Google-owned blog service, you may be using one of their default templates. Those are nice, but it’s likely you’ll want to jazz it up a little with your own style. In a few simple steps, you’ll have your new banner in place.
For the purposes of this tutorial, I’m using the very basic, default theme for Blogger called Minima, shown here.
This demonstration applies to other themes in the library, as well, but this should give you a place to start. First, you’ll need to login to your Blogger account and access the Dashboard, as seen here.
Once you’ve logged in, click the Layout link right from your dashboard. It will take you to a page that has a simple framework of a blog design. (For a refresher on the bits n’ parts of a blog theme, please check out this post, The Non-Designers Guide to a Blog Design Theme.)
Click the Edit link in the Header area.
A pop-up should appear, if you allow pop-ups in your browser, or it may open in another window. If a pop-up or another window/tab does not appear when you click that link, make sure that you do not have a pop-up blocker on. That could be the culprit. The pop-up window will allow you to configure the details of your header.
You can title the blog anything you like and even add a description. Select Browse to choose your prepared banner file from your desktop. Then choose whether or not you wish to have it behind or instead of the title and description in the header. I’ve chosen Instead of Title and Description.
At this point, you can choose Shrink to Fit, but only do so if your banner is wider than 660px wide. In very tiny print, it indicates that your banner will be shrunk to fit 660px wide if you choose this option.
Once you have all the settings as you like, click the big orange Save button on your pop-up window. The pop-up will close and take you back to your Layout page.
Designer Tip: I recommend designing to fit and not having the blog platform condense your file for you. It can lead to degraded file quality, resulting in blurry imagery or text. So, I recommend that you design your banner 660px wide before uploading and do not choose Shrink to Fit.
Height is not restricted, but too tall is also distracting. I recommend no more than 250px tall for this template.
EXTRA DESIGN TIP FOR MINIMA THEME USERS!
The instructions indicate your banner should be 660px wide, but if you are using Minima theme and upload a file to 660px, it actually hangs over the borders of the header area due to the small padding and borders this theme applies. For the Minima theme, I recommend you design-to-fit your banner no wider than 648px.
Back at the Layout page, you’ll be greeted with a yellow message along the top letting you know you’re changes have been made and encouraging you to view your blog so you can see your new banner and make sure it’s displaying correctly.
If your banner looks like you intended, as mine does here, go back to the Layout page and click the big orange Save button near the top to confirm your changes.
You should get another yellow confirmation message, letting you know that your changes have been saved. That’s all there is to it. Happy dance!
But, what if it doesn’t look how you wanted or you want to change it or it’s too big or the sky is falling and the only hope to save humanity is to change your blog banner!? Follow all the steps above, but when you click Edit on the Header area, the pop-up will already contain your existing banner. Simply click Remove Image and start again. Easy!
Now that you know how to change your banner on Wordpress.com and now Blogger, it would be
