Tuesday, 27 May 2014

Spruce up your blog no 2: adding a blog header.



In my first post of my 'Spruce up your blog'series I told you about how I updated my blog template, which I totally love! Today I'm going to talk about how I added my own touch to the design by adding a different blog header.

Below you can see an image of the template I used. The standard template header was just plain writing, Dancing script for the main font and a font called Crushed for the description, it is simple but pretty but I wanted more.


The fabulous thing about this template is you can edit it really easily using the template designer. You can edit the colour, size and the actual fonts used. You can also change the widths of the blog, for example I increased the size of the sidebar so all my social media sharing icons fitted in one line. There are so many free and paid fonts that you can download to your computer which are then available for use in blogger template designer, your installed computer programmes and also in some Picture editing websites such as Fotoflexer. The fonts you download won't be available in Pic Monkey but they have lots of great fonts for you to use anyhow. Have you ever tried Ribbet?, it's another simple online photo editing site. Very similar to the well loved and missed picnic. Although I have to say between the Picmonkey, Ribbet and Fotoflexer I have everything I need. In Ribbet you can upload your own fonts from your computer to. It is dead easy! I have only just discovered this and I'm very excited. I'm sure it will come in very handy in the future.

Once you have uploaded your image to edit onto Ribbet or chosen to use a blank canvas you click on the text button (once you've used one website you can use them all) and there will be an option to 'load my fonts' click on the button and wait a few seconds and you are done, you have access to loads more fonts!



You can see in the image above some examples of fonts I have uploaded. But I digress, lets get back to business, adding a blog header.





Go to template on Blogger dashboard to do this. Click here if you need a reminder of how to do it.


So to edit your template go to Blogger dashboard and click on template and then on customize.  Now you need to click on advanced.


In advanced you can change the fonts, colours, text and width and layout of your template. Any changes you make  will show in the preview screen. You will need to do this again once you have added your new blog header to make sure it is in the right position, eg central.

Once I'd made a few tweaks with the fonts sizes and size of the sidebar, I wanted to change the header. I used Picmonkey for this. I've talked about Picmonkey before and it is used by many bloggers because it's free and simple to use. I actually decided to upgrade to premium a while ago because I wanted to use some of the designs that were only available with the premium package. It's $4.99 a month which is about £2.96. I think it's a reasonable price, I mean we get spoilt, be you a blogger, crafter, sewing enthusiast or srap-booker we have access to so many free resources, we get use to it but there's no harm in paying sometimes, I mean the amount of work that goes into these sites or the freebies people make, it's only fair I think.

As part of the template I have used, there is that lovely pink header, so I all I wanted to do is add my own text. I wanted a  blank canvas to use so if you hover over Design, a selection of canvas sizes come up. You can choose whichever will be suitable for your project. I used custom and chose the size 1000 x 300 pixels. I have previously done some research abut sizes which is why I have chose 1000 x300.



I needed a design on a transparent canvas so I can design an image and then uploaded it to my blog. I needed white writing but it was difficult to see the design on the canvas so initially I did the design in black and changed it to white once I was happy with it. You can see from the image below how hard it is to see the white.




The 2nd image above is just to give you an idea of what I was doing. Once you have done your creative bit you can save it to your computer ready to be uploaded to your blog.

To add it to your blog go to layout and then click on edit header. You then choose file and upload it from you computer. You may need to click shrink to fit but I didn't need to. I also have a blog description so chose 'have a description placed after the image'.


Now you may need to have a bit more of a fiddle so that your blog header looks right, for example moving it central. I had done this with my last blog design but couldn't remember how so I looked at some tutorials and found some great ones. I used one on Plumrose Lane which is a fabulous blog by a lady called Sharon, who is an artist, graphic designer and a jewelry designer. This is a great tutorial on 'How to center blog header'. You can click on the image below to check out her blog too, there are several tutorials on there and she has an Etsy shop too.

Plumrose Lane
Whilst looking for tutorials I also came across Carries Loves who tells you how to center stuff on blogger. I also got my cute social media icons from her too. So her site is definitely one to check out.
Ok, there you have it, how to add a blog header. My next post on updating my blog will be on how I added my welcome image. Subsequent posts will be on adding your own sidebar labels and how I added some of my widgets or where I found them such as recent comments widget and back to the top arrow.  If there is anything else you would like to know about please leave a comment and I'll see what I can do. Likewise if you have come across any good blogs or tutorials or fabulous widgets, let me know about those too.

6 comments:

  1. I am okay when using just blogger to change my blog look but I'm hopeless using any other stuff. I downloaded a photo app I think it was picmonkey but it might not have been.It downloaded so much other junk to mu computer that I had to delete it all. I think you need to come and stay with me and show me how.I will read this again later when I've more time for it to sink in.

    ReplyDelete
  2. Very clear help. Thanks so much. I'm saving this post so I can use it when I find the time to change my layout.

    ReplyDelete
    Replies
    1. Thanks Pam, glad you found it clear. I need/like things to be as simple as possible so thats what I try to do :)

      Delete
  3. Great ideas I need to get brave with fonts.

    ReplyDelete
    Replies
    1. Thanks Jennifer. There are so many brilliant free fonts out there and I'm it's great that you can upload them to Ribbet to use. Definitely give it a go!

      Delete
  4. Thanks so much for this walk through and your other post about the background-I'm just starting a blog and I used your tips to create my design :)

    ReplyDelete

❀Thanks for stopping by, I always love to here what you have to say. I like to reply to your comments and especially love it when you're NOT a "noreplyblogger" so I can email my reply to you! If you like what you read have a peek to your right for ways you can follow me and my blog❀

Total Pageviews