A lot of my design clients who use Blogger ask for a design that is not so Blogger-ish. This happens more often than not, so I thought I’d share some tips on how to take the Blogger out of your Blogger blog.
Super easy things everyone can do right now!
- Add a custom header.
- Layout >> click Edit on the Header gadget >> Uncheck “Shrink to Fit” >> Browse… select your header image from your computer >> Check the option “Instead of title and description” >> Save.
- Add a custom favicon.
- Layout >> click Edit on the Favicon gadget >> Browse… select your favicon image (must be a square image!) >> Save.
- Remove the About Me gadget.
- Layout >> click Edit on the About Me gadget >> Remove.
- Add a customized about me gadget to your sidebar.
- Layout >> Add A Gadget >> Image >> be sure to uncheck the Shrink to fit box >> Browse… select you image from your computer >> Title: fill in your title (e.g. Welcome, Hello!, About Me, etc.), if you want to leave this blank – well, you can’t – so enter this code instead: <! – -> >> Caption: enter in your welcome message >> Link: you can either leave this blank, or you may link to your About page >> Save.
- Remove the Blogger Navbar.
- Layout >> click Edit on the Navbar gadget >> Off >> Save.
- Remove the followers / Google Friend Connect gadget.
- Layout >> click Edit on the Followers gadget >> Remove.
- Remove the background colors from the date, tabs and post footer.
- Template >> Customize >> Advanced >> Date Header >> Background Color >> change to white (#FFFFFF) or transparent (and, change the date color to something other than white!) >> Apply to Blog. (Repeat for Tabs & Post Footer.)
- Remove the borders from menu bar (tabs).
- Template >> Customize >> Advanced >> Accents >> Tabs Border Color >> change to white (#FFFFFF) or transparent >> Apply to Blog.
- Remove the post share icons (use a set from AddThis or ShareThis)
- Layout >> click Edit on the Blog Posts gadget >> uncheck the Show Share Buttons >> Save.
At this point you could either purchase a premade Blogger template that has the following options included with the design, or you can DIY it. These things are a bit more tricky and most involve editing the HTML of the template… be sure to make a backup of your template before you begin!
- Remove the Subscribe to Posts (Atom) link that shows up at the bottom of your site – DIY here.
- Remove the shadows from post images – DIY here.
- Remove the Attribution gadget – DIY here.
- Remove the dots from the pager section (Newer Posts, Home, Older Posts) – DIY here.
- Remove the letter spacing for the blog post date – DIY here.
At this point you have a pretty un-Blogger-ish looking blog, how do you like it?
Suze says
Thanks for the tips! This is so incredibly handy 🙂
Suze recently posted… NIEUW – sieraden
Mariana says
Hello, I like your posts. They work on me. However, now, I’m looking for how to change the background color of my blog’s footer. I have been searching for here and there but unfortunately, I haven’t found it. I’m a new blogger anyway, so I’m still not that good on it. But I’m going to seriously blogging so that’s why I need ur help hihi. Thanks 🙂
Judi Fox says
Love all the tips. I didn’t even know I could make things transparent. I have some questions now. 🙂 I need some clarification…. what do you mean by “change the date color to something other than white!” Do you mean that hiding the date with white makes it a problem for some browsers? I am pretty sure I hid my date / time / stamp with white because I didn’t want it to show up on my landing page. I didn’t want it to look like a “blog”.
I am getting ready to launch my new website – where I focus just on my Resume Remodeling business. Up until now I have just been playing behind the scenes with blogger html, but tempted to check out wordpress. You always give me lots to think about and great ideas! Judi
Carrie Koehmstedt says
Sorry for the confusion, I was trying to say if you make the background white, you’ll need to change the font color to something other than white – for example black. Your blog looks great as it is now on your blog.
Carrie Koehmstedt recently posted… How to make your Blogger blog not look like a, um, Blogger blog
lissa says
they’re all great tips. & also make the width wider, which I wouldn’t recommend a while back but now with larger screens and all.
hope you have a great day.
lissa recently posted… Strangers in the rain
Carrie Koehmstedt says
That is a great tip! Making your blog wider definitely makes it stand out and allows for bigger pictures, too. Win-win.
Carrie Koehmstedt recently posted… How to make your Blogger blog not look like a, um, Blogger blog
Aunie says
Carrie, this is a GREAT POST! I even learned a thing or two. Thanks!!
Aunie recently posted… Military Mindset: A BMT Update
Kat says
Can I first say that I LOVE your blog! You have helped me so much with mine! I just was reading your most recent post on how to make your Blogger blog not look so much like a Blogger blog, which is phenomenal I might add because it drives me mental. I tried the Favicon trick and it is not letting me change the Favicon! It is still the orange B Blogger Icon, I am wondering if I am doing something wrong, however I did follow the instructions and my image shows up when I go into the edit on the favicon link. I have no idea but I have found lately that my blogger dashboard has been very glitchy! Thank you for y our awesome post! 🙂
Kat recently posted… Stereotyping….
Carrie Koehmstedt says
No, there is nothing wrong with the favicon… after you upload it to your blog it can take 24-48 hours to display in your browser’s tab organically. If you want it to appear right away you’ll need to clear the cache/cookies on your browser.
Carrie Koehmstedt recently posted… How to make your Blogger blog not look like a, um, Blogger blog
karen says
brilliant advice, as always! Thanks, Carrie!
Neelu says
Love these tips! Going to apply them now. Thank you. 🙂
Neelu recently posted… Musings on Turning Thirty and Lessons Learnt
OHMYcron says
These tips are amazing! I have been so nervous about creating a blog because I was frustrated with not knowing how to code and develop my own layout. This really helped me start to make something I actually like – you’re awesome!
OHMYcron recently posted… Welcome!
Jackie Bouchard says
Thanks! This was super helpful. Implemented almost all of these. (Took me forever though, because I also wanted to tweak some fonts/colors using the ‘advanced’ customization option for my template, and for some reason they wouldn’t take. Took me hours to get that all sorted out!) Anyway, thanks again!
Jackie Bouchard recently posted… Less-Wordy Wed.: Note to Self(ie), Games of Bitey-Face + Selfies Don’t Mix
Eilidh says
My ‘prev’ and ‘next’ buttons at the bottom of my page aren’t working. Have you got any idea how I can fix this?
Eilidh recently posted… Introducing Alfie | Newest Addition
Eilidh says
Nope, basically it was a blogger template and they were working but suddenly they’re not and I don’t know if I’ve edited code by mistake or something :/
Eilidh says
Nope, basically it was a blogger template and they were working but suddenly they’re not and I don’t know if I’ve edited code by mistake or something :/
Eilidh recently posted… Introducing Alfie | Newest Addition
Eilidh says
I’ve had a look and coding just doesn’t make sense to me. If I were to email you the backup I’ve just made, is there any way you could possibly look at it and see if you can spot the issue? It’s just the basic simple blogger template I’m using. x
Eilidh recently posted… Introducing Alfie | Newest Addition
Eilidh says
Got it sorted, it was my post divider that was causing problems x
Estephanie Pimentel says
I am so glad I found your page ! it has been so incredibly helpful for me as an upcoming blogger ! Thank you for your help ! 🙂
Vanessa Tang says
Hello Carrie,
I’ve found wonderful, helpful tips with your blog! I’m not really a fan of the default comment box that comes with the Simple Template and was wondering how I could get a comment box that was similar to yours in black and white?
Thank you for your time!
Rick Barry says
Great tips, thanks! I will be tinkering in the coming days.
Kahar says
Thanks for the tips
Aniekeme says
This was super helpful! Thanks!!
I was wondering, do you know how I can change the default comment box on Blogger to something like what you have on here – with Name, Email, Website and Comment?
Please and thanks x
Ellen Oliveira says
Thanks for this, pretty clear on what to do. 🙂
Ellen Oliveira recently posted… You Know You’re Parent When
Nduka Ofoegbu says
thanks for this wonderful tutorial am indeed grateful
Julia Kim says
hi carrie! The second to last bullet is not linked, just so you know!
Julia Kim recently posted… BLOG SPOTLIGHT | ATLANTIC-PACIFIC
Olivia says
Thank you so much! This helped a bunch 😀 xxx
Olivia recently posted… Review: MAC Sweetie Lipstick
Sharon says
Thank you so much for that list. Several of those things I was thinking I’d need to try and find them but you have time all with each other. Very helpful. Thank you.
Deija says
thanks so much for this post! it was super helpful when I started out my blog. have a great day!
Ashley Brooke says
Great post so helpful!
xx
http://dreamerindior.blogspot.de/
https://instagram.com/ashleybrookeanderson/
Jahanara Akter says
I was really starting to feel hopeless when I found your post. Thank you so much for helping me resolve my issue.
Jahanara Akter recently posted… Flow Chart of Embroidery in Garments Industry
Frenchy says
Thank you! I well definitely be putting your wise words in to practice. Just started a blog and it is looking very sorry for itself. And definitely very bloggy.
Frenchy recently posted… Work tomorrow
Hannah says
Thanks this helped me so much!!
Michaela Roque says
Hi!
I am trying to put a customized footer image at the bottom of my blog, similar to the one seen on http://www.collagevintage.com
I tried uploading it as an image with html through the layout options but the image doesn’t center because of its width. I wanted it to be the size of the page. I haven’t been able to figure out how to make it work so if you have any suggestions or know how to help me I would really appreciate the help!!
Thank you! 🙂
Carrie says
Hi Michaela – Looks like the footer at Collage Vintage is a full-width footer that spans the width of the site. In order for your footer to do the same you would need to make your footer full width. XOMISSE has a great tutorial on how to do this: http://xomisse.com/blog/make-header-full-width-blogger/.
Tawhida says
its a fantastic article. I love to read such kinds of article that you shared. thanks for sharing it.
Tawhida recently posted… An Overview of Child Growth and Development
Cassie says
Thanks for the tips! I don’t know if Blogger has changed since you posted this, but I wasn’t able to do the first tip. There is no “shrink to fit” the header option. I hate that the corners are rounded on everything!
Carrie says
Hi Cassie,
I still show Shrink To Fit on the header widgets… must be the template you are using, maybe that option is coded out?
The corners are rounded on everything because of the base template you are using Picture Window. To un-round the corners look for the border-radius code throughout your template’s HTML.
ex:
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-goog-ms-border-radius: 10px;
It is in .content-outer, .header-outer, .Header img, .tabs-inner .widget ul, .tabs-inner .widget li:first-child a, .post-outer, and .footer-outer.
DELETE these 4 lines of code that are for border-radius.
Molly says
Hello,
I love the font you use!! What is it called and where do I find it I want to use it for my YouTube banner!!
Carrie says
Hi Molly, I use VeryBerry script font http://crtv.mk/iyKv for my headings, and in my header I use Stay Bold font http://crtv.mk/f0Mf7.
Molly says
I HAVE USED ALL OF THESE!!! I LOOOVVVVEEE IT!!!!
Catherine says
Thank you so much for these tips! I just did them all and my poor old neglected blog (that I am revamping before I start blogging again) is looking the best it ever has!! Really, really appreciate you sharing your knowledge.
Katelyn says
Hi Carrie,
I found your blog post on another website (figured you should know). See below. Your tips were extremely helpful! I could tell yours was the original because theirs didn’t have the links to the DIY pages at the end of the post.
http://cmpfun.blogspot.com/2015/09/10-tips-to-your-blogger-look-like.html
Carrie says
Whoa! Thanks Katelyn for the heads up, I submitted a comment asking them to remove the content, hopefully they are total jerks and do the right thing.
Michael says
It’s Pretty Cool Post For Me, helped a lot
Michael recently posted… Sanam Re (2016) Songs Lyrics | Pulkit Samrat
Kacky says
Wow – this post was amazing and so helpful. It seems like you posted it a while ago yet it’s still incredibly applicable and useful! I’ve done a lot of Google searches for posts like this yet yours was the most concise, straight forward, and easy to use. Thank you!
Mayedul says
This article is very effective especially for me. I was searching about it. Now my problem is solved. Thanks for sharing your valuable experience.
Mayedul recently posted… Quality of Trimmings Should Ensure in Apparel Industry
Gemma says
Does anyone know how to change the date header colour another way? The colour field is not there to change as above, and the date header tag isn’t in the html thing which everyone else online has suggested, so I’m a bit stuck as I don’t know how to edit CSS/html properly! Thank you very much 🙂
Carrie says
Hi Gemma, leave a link to your blog and I’ll take a look.
Megan says
Thank you for the amazing Tips, it helped so much.
Technokrats says
Can we set a page as home page in a blogger website?
Carrie says
Yes, there are lots of ways to do it, if you Google your question you’ll get the answers you need.
Leni says
Hi Carrie, thanks for this amazing tutorial. I would like to have my pictures in original size not square. Do you have any hints for me?
Natasha Fraser says
Amazing! It looks 20 times better with just those tweaks. Thank you for the tips!
Juliette Broucke says
Thank you! This helped a lot!
jasmine says
Cool write up!! I loved it *smile*
Mandi says
This is so helpful! Thank you for this .
Veronica says
Super easy and simple post Thanks !
But how do I make a Comments Box like your one ?
: )
kIND Regards
MD Kawsar says
Wow, Really it’s a great post. Your post is really helpful and have lot of resourceful information. Thanks for sharing a nice post with us.
MD Kawsar recently posted… Modern Interior Design Bangladesh
Rihan says
Nice post. It helps me lot.
Rihan recently posted… Quality Control in Apparel Industry
Devansh Das says
Thanks a lot. The t8ps and the methods worked out well
Mitzi says
Hi Carrie,
All of this are helpful, but can I request a tutorial on how to put square borders around your widget titles? Thank you.
Aimsy's Antics says
Thanks for the great tips!
Here’s to making our blogs fabulous!
I have just started my blog, so I am sure these tips will be filtered in as I go along.
Aimsy
xoxo
Ayden says
Thanks for such wonderful tips. For newcomer’s these suggestions works like magic for there blogs. Indeed a great work.