How To Un-Blogger Your Blog

If you use Blogger as your blogging platform, you'd know how unattractive some aspects of their free templates can be. Luckily, there are ways around it! I've always used Blogger for my blogs. I trust the site, I love how it's linked to Google and even better, I love that it's free! Blogger has only ever been down once for me in the past eight years, so I think that's pretty trustworthy!
I wanted to take you through all the ways I can think of, that you can "un-Blogger" your blog. In other words, how to make one of their default templates look it little more professional.
1. Remove the Blogger navbar
This is the navigation bar that is always visible at the top of your blog. It doesn't need to be there! In your Blogger control panel menu, go to Layout > click 'edit' on the navbar gadget > check 'off' and save.

2. Add a custom header (logo)

If you have created your own blog logo and you want it to appear at the top of your blog, go to Layout > click 'Edit' on the Header gadget > Choose your logo image from your computer > check 'Instead of title and description' (so it's the only thing visible at the top) and save.

3. Center your blog header

Your blog will look way better if your logo is centered, so go to Theme > Customize and in the small menu go to Advanced > Add CSS. Paste the following code into the box and click on Apply.

#header-inner {text-align:center !important;} #header-inner img {margin: 0 auto !important;}

4. Remove "Powered By Blogger" attribution

At the very bottom of your blog you'll see that it says "Powered By Blogger". To remove that, go to Theme > Customize and in the small menu go to Advanced > Add CSS. Paste the following code into the box and click on Apply.

#Attribution1 { display:none; }

5. Remove the 'About Me' gadget

To remove the default About Me gadget in the side bar, go to Layout > click 'Edit' on the About Me gadget which is in the side bar section > click on 'Remove'.

6. Add your own 'About Me' gadget

If you want to add a better-looking About Me section to your side bar, go to Layout > click 'Add A Gadget' in the side bar section > choose 'Image' > enter "About Me" in the title field > upload your profile pic and link it to your About Me page.

I then suggest adding a Text gadget underneath (following the same instructions above) and writing a short bio to appear under your profile pic.

7. Center post title and date

Another way to make your blog look more professional and neater as well, is to center your post titles and dates in the content section. Go to Theme > Customize and in the small menu go to Advanced > Add CSS. Paste the following code into the box and click on Apply.

.post-title { text-align: center; } .date-header { text-align: center; }

8. Remove the shadow border from post images

When you select a default Blogger template, it will most likely have an annoying grey border around each image you post to your blog. To stop this from happening, go to Theme > Customize and in the small menu go to Advanced > Add CSS. Paste the following code into the box and click on Apply.

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {   padding: 0 !important;   border: none !important;   background: none !important;   -moz-box-shadow: 0px 0px 0px transparent !important;   -webkit-box-shadow: 0px 0px 0px transparent !important;   box-shadow: 0px 0px 0px transparent !important; }

9. Remove 'Subscribe to: Posts' from bottom

This feature isn't that necessary in my opinion, so you can remove it by going to the Add CSS part again. Paste the following code into the box and click on Apply.

.feed-links { display:none; }

10. Remove Google Friend Connect gadget

I don't know too many people who still use Google Friend Connect. If you do, by all means keep this in place! If you're more into Bloglovin, you can remove this gadget to de-clutter your side bar. Go to Layout > click 'Edit' on the Followers gadget in the side bar section > click on Remove.

11. Remove the dotted line

There is a dotted line that will show up at the bottom of your content section, where the links to 'Older Posts' and 'Newer Posts' is. To remove it, go to the Add CSS part again. Paste the following code into the box and click on Apply.

.blog-pager { background: none!important;}

If this post helps you out, or there's something else you'd like to know about, please let me know!