April 6, 2015

How to Create a Custom Header for your Blogger Blog

I am constantly tweaking my blog design. I have purchased Etsy designs twice in the past, and I would literally die to have a custom design, but with a wedding to plan, I don't have the pennies for that right now. So I just continue to play with html and tweak my design every so often. 

One of the things that I find makes the biggest difference in the atmosphere of your blog, and is also the easiest to change, is your header. I'm always surprised to find out how many people don't know how to create or change their header, so I thought I'd share the wealth. 


First things first. You must have some medium to create your header on. Some excellent options are: Photoshop, Canva, Pixlr, and PicMonkey. I don't have Photoshop, and I have had success creating images with both PicMonkey, Canva and Pixlr (which are all free online).

You also must know the width of your layout. For example, my layout is 1110 pixels wide. To find this information out, you can go to Template > Customize > Adjust Widths.

Once you know the width of your template, you know how large to make your new file (which will become your new header). There is no hard and fast rule for how tall your header should be, but I have the best luck when I keep mine between 250 and 350 pixels tall.

You probably have an idea of what you want your design to be, but my best advice is to keep it simple. I have played with lots of colors, fonts and textures, and the best ones have been the most simple. Pinterest is an amazing resource for free design elements, clip art and fonts. I found the watercolor element that is currently in my header through Pinterest for free.

Once you are done creating your beautiful new header, make sure to name it something so that you will be able to find it in your files.

Now you are ready to upload your header to Blogger! Go to your layout tab and look for where you can edit your header. It looks like this:


You need to open it, and then upload your new image where it says "choose file." You want your image to show instead of the title and description, so click on the second choice down.


Once you have saved your file, you should be able to see your new beautiful header on your blog! Go admire your work, and then share it with the world! This is such an easy way to refresh your blog, so there is no reason not to make this simple change. 

Have you ever updated your own header? Would you like to see other simple blogging tips?

16 comments:

  1. This is awesome. I've had Ashley do redesigns because I had NO idea how to do this. Thanks for breaking it down!

    ReplyDelete
  2. I love your header & Picmonkey is a lifesaver. I also would die for a custom designer, but I'm pretty sure that won't happen until next year

    ReplyDelete
  3. I use PicMonkey a LOT when working on my blog design...I have had custom designs in the past but I like to do it myself in case something messes up then I can fix it!!

    ReplyDelete
  4. That's exactly why I haven't jumped in yet! I always do mine late at night, so that people (hopefully) can't see if I mess up! Lots of trial and error over here :)

    ReplyDelete
  5. Oh definitely not. Pretty much everything has either been purchased in parts, or self taught. It's amazing what you can learn on google!

    ReplyDelete
  6. It's amazing what you can figure out from massive amounts of googling! :) I would absolutely LOVE to have Ashley design something for me. I really just need to bite the bullet and do it.

    ReplyDelete
  7. Canva is another great option that is even more simplified than PicMonkey, for anyone that is design challenged! I also love Fiverr for cheap, quality logo or header design.

    ReplyDelete
  8. Such a great help for those that aren't well versed in blogger! I'll definitely have to share this with my friends who are just starting out! :) I love using photoshop to adjust and even totally refresh my header!

    ReplyDelete
  9. Thanks for sharing this!! I thought about re-doing my blog, but probably shouldn't spend the money on it now. How did you get the header to move down with the page?

    www.Fashionabella.com

    ReplyDelete
  10. You have no idea how much I needed this today! I've been slowly re-doing my blog, but I'm stuck at a header, so I haven't put one up yet. Thanks for the tips!

    ReplyDelete
  11. I just started using Canva, and I am still working on figuring it out. It seems awesome though!

    ReplyDelete
  12. I have spent way too much time tinkering with this stuff! I have been thinking more and more about sharing little stuff like this. I'm glad it helps!

    ReplyDelete
  13. Do you mean the pages? That was part of the design that I purchased from Etsy, but if I figure it out I will let you know!

    ReplyDelete
  14. No problem! I love re-doing little stuff like this. Glad I could help!

    ReplyDelete
  15. Great blog :) Thank you for sharing, Alexandra! Cheers.

    ReplyDelete
  16. This is a great tutorial! I love picmonkey and use it for practically every blog post. Is your header now one that you made?

    ReplyDelete

Comments make my day! Leave me some love :)