Recently I decided I wanted to give my blog a makeover however I was adamant that I wanted to do this myself, with the help of various tutorials and resources I have been able to transform my blog. All of the resources I used were free and the majority provided by other bloggers. Therefore, I thought I'd create this post as a shoutout to the kind individuals who shared these tips and tricks, but also as a guide for any of you looking to customise your blog.
Before starting the post I want to say that I would recommend backing up your template before making any changes, in case it does not work correctly.
1. CHANGING FONTS
I really wanted to change the font of my blog to make it look tidier. I wasn't a massive fan of the preset fonts, so I used a tutorial by helplogger to change the fonts on my template. It covers how to use both google fonts and other font files, but there are so many google fonts to choose from that I went ahead and used this method. I'm currently using Martel for my blog headers and Lato for the main text.
2. CUSTOMISING THE HEADER
To create my blogger header I found a pattern on google images that I liked. I then used a photoshop tutorial to turn that image into text. The font of the header can be downloaded from here. When I opened the image on photoshop I simply clicked image - image size. I then changed the pixel dimensions to 736 x 200 so that it would be the correct size. Once the image was created I then went onto blogger clicked layout - edit header and uploaded the image instead of the title and description.
3. THE TOOLBAR
To create the menu at the top of my blog I used a tutorial by xomisse. She has a ton of easy to follow blogger tutorials for pretty much anything you could want to customise. I used this tutorial for the drop down menu. I then used this to add the search bar, and this to add the social media icons. I customised the search bar myself using the code in the tutorial. The social media icons I'm using I also created myself, however I will place some links later on in this post to some lovely free icons.
4. REMOVING SIDEBAR FROM BLOGGER PAGES
This customisation goes hand in hand with the toolbar at the top of my blog. When clicking through to the about me page I didn't want viewers to see the sidebar, instead I wanted the page to be full width as I felt it looked neater, to do this I used this code by Blogger Tips Pro.
5. STOPPING THE 'DISPLAYING POSTS WITH...' MESSAGE FROM APPEARING AT THE TOP OF SEARCH RESULTS
Another customisation that links to the menu bar was editing the template so that the search bar and drop down categories wouldn't display the preset message, and instead the page would look cleaner and fit within my theme. To do this I used another tutorial by xomisse. Which also tells you how to change the message or edit the style of it.
6. THE SIDEBAR
The sidebar on my blog has undergone a big transformation. I used a tutorial by Brenda to add the dotted line in between widgets. Then this one by Code it Pretty to create my Pinterest widget. The Instagram widget can be found here. Finally I used a tutorial by Bloomin' Rouge to edit the thumbnail size on the popular posts widget.
7. SCROLL UP ICON
For the back to top button in the right hand corner of my blog I used a tutorial by Carrie. However I customised it slightly and switched the free icon she provides with this one here. This was probably the simplest out of all the customisations and makes my blog much easier to navigate.
8. REMOVING THE 'SUBSCRIBE TO: POSTS (ATOM)' AND 'HOME' LINKS FROM THE BOTTOM OF THE BLOG
Now this isn't a necessary customisation, but one I wanted to do to improve the overall appearance of my template. To remove the subscribe link I followed another helplogger tutorial. For the home link I used this. I then added a home link to my footer instead.
9. PIN IT BUTTON
I created the pin it button myself on photoshop, however this tutorial by Spearmint Baby is helpful if you wish to add a custom one to your blog, they also provide some free buttons for you to choose from. On a side note the tutorial says to upload the image to picmonkey. I find it easier to upload the image to a draft post on blogger, change from 'compose' to 'html' and copy the image link that way.
10. SOCIAL MEDIA ICONS
As promised here are the links to social media icons. Carrie provides simple icons in a variety of colours and sizes and also has a tutorial on adding them to your blog. Geek Fairy provide minimal black circle icons. Hopeful Honey has beautiful watercolour icons as well as many others, and there's some colourful ones available at Beautiful Dawn. However a quick search on google should bring up a variety of free icons available to use.
Let me know if you have any problems with any of the customisations and I will do my best to help you. I hope this post was useful, feel free to tell me your thoughts on it.
Follow me on Bloglovin' | Follow me on Blogger