Blogging tips

All about your side bar

1:24 PM

Everything you need to know about your blog side bar
Ah the side bar! This glorious space you can pack with widgets, infos and digital trinket to your heart's content.
This narrow slice of heaven where you can personalise to reflect who you are and what you do (you because just the blog posts won't do).

Stop right there!

The side bar is an area of your blog you should not underestimate in any way and should take care about as much as the rest of your blog.
One upon an early 00's this was the prime spot for the craziest widgets, blinkies (do anybody remember that craze), clipart and GIF gallore.
It was the place were your post archive went, and where you would put a little "About" snippet. And if you really wanted to be cool, add a page view counter of one kind or another.

But back to circa 2016, you might want to rethink that side bar strategy a little, especially if you are running a blog you want people to take seriously.
Gone are the days when it was ok to induce epilepsy seizures in your readers (blinkies overload syndrome).
Your side bar is serious business, and it should be treated as such.

You want it to be easy to navigate, clean looking and full of relevant infos that will help your readers.  If you haven't touched up this section of your blog in a while, now is the time to look at it and weed out the widgets that no longer make sense, and keep or add the ones that will help your blog in the long run.

If you find yourself wondering what exactly qualifies as "useful content" here are a few items to get you started:

An about section and picture

You must show who you are somewhere on your blog, and one of the most common place to find a snippet of information is by adding a few lines and a picture to the top of your side bar. Which you noticed I haven't done, but hold these stones will you? Let me explain how I approached it. I have my picture on the header, this is a personal choice I made, and I made sure I have a full "About" section on the nav bar instead. Will that change in the future? Maybe. For now this option works better for me. But if you haven't made up your mind about where to put that essential bit of info, the side bar is the best place to start

Your social media icons

You must offer a way for your reader to follow you on any of your official handles. How many you have is really up to you, but do make it easy for your follower to connect with you. There are plenty of ready to use social icons you can use, or you can design your own. 
Then, open a new HTML/Java Script Gadget on your blogger layout tab and enter the appropriate code for it. The code should roughly look like this : 

<a href="http://www.yoursociamedialink.com"><img src="http://www.yourimagelink.com/image.jpg"></a>

Replace the red text in the code with the appropriate URLs, for the social media one it means the link to your handle, for example my Instagram URL would be : https://www.instagram.com/homecynhome/
The image URL is where the picture you plan to use is hosted. In the case of my social media icon, it would be photobucket. If you have a photobucket account, each picture will have a set of codes you can copy, the one you are looking for is the "direct" URL. 

Email subscription

If you want people to read you, you must offer them many way to follow you. Some will do it exclusively via social medias, some will prefer adding your blog to a feed reader. And there are those who will prefer to get your feeds delivered straight to their mailbox instead. 
An email subscription can either be a subscription to your feedburner feed (like it is the case on my blog) or a Newsletter system you set up and for which you will need to provide a physical address and will remember to write yourself each time you want one to go out to your reader. 

If what you are looking at is just enabling your reader to subscribe to your feeds, here is the link to the tutorial that helped me set up my own widget. Note that for this tutorial to work you must have the official blogger email widget already set up on your side bar, so if you don't have it yet, do so buy going to your "Layout" tab and click Add Gadget and choose the email subscription from the list. 

Popular posts

This one is  MUST have on any blog. It provides an opportunity for your reader to discover more content straight from your blog and have them just hang around a bit longer (and lower your bounce rate). You can add it to your blog in blogger by going to your Layout tab, and select the popular post widget from the list when you click "Add Gadget". This will set you up with the standard default Blogger Popular post widget. 
Once you have this installed, there are ways to prettify it with some coding. I used a code found on this page for mine. 

I set my widget to display the top 5 popular posts of the last 7 days, but you can set it up to display the top best post of forever, or the last month. Keep in mind that the more often the list change, the more people will notice it and feel like clicking on it. 

Blog search tool

In blogger, you have two options: either you keep the official kind of blah looking "Blogger Nav bar" on top of the page and your search feature is covred automatically. Or, you set up a gadget on your side bar. To do so, you again must go to your Layout tab in blogger, and add said gadget from the gadget list blogger provides you when you click "Add Gadget". This widget will again be looking very blah and generic, but once again, you can customize it if you know a little CSS coding, the code I used and tweaked can be found here.


Those elements above are the one your blog absolutely MUST have to make a positive impression. Then there are all the extra add ons,  like ads, sponsors, link party icons, sister sites and image links to seasonal pages you can simply by adding a new "HTML/Java script" Gadget. 

Here are a few things you must keep in mind before I conclude this post: 

1) If you give a title to your HTML Gadget it will appear as such on your side bar. If you don't want each different link party icons to be in their own section, leave the title area blank. 

2) The font and colour of the Gadget title can be changed if you go to your template editor: Template > Customise > Advanced > Gadgets

3) The pretty pink line I added to my Gadget titles is a product of a tutorial that involves using an image and a code. You can find the complete tutorial over here

4) Remember to keep your side bar content up to date, if it never changes, people will stop noticing it. It is a good idea to run seasonal features and mini series often. 




7 comments

  1. Hey Cyn,
    That "Main Labels" gadget is cool on your side bar too.
    How do you get that "you might also like" thingy at the end of your post?
    I've been looking at those "recipe indexes" with the thumbnails, I'm not sure if I want one the take forever to load.
    I found a graphic designer whose collage work I really like, I think she could do a really nice kitschy "Bollywood" look to my blog-
    http://www.karenvalentinedesign.com

    ReplyDelete
  2. The you might also like thingy is the "LinkWithin" widget, which I heavily modified with some CSS coding. First you need to install the linkwithin widget which you can find here : http://www.linkwithin.com/learn

    Then once that is set up, you can get it to look it nicer with round thumbnails and things by following this tutorial and code: http://helplogger.blogspot.in/2014/02/customize-linkwithin-gadget-related-posts-gadget.html

    ReplyDelete
  3. The linkwithin site asks the width of my blog 3 tories, 4 or 5? what is that?

    ReplyDelete
    Replies
    1. This means the number of links you want featured in the widget, my text area is 700 pixel wide so 5 stories fit on one line, if your post area is narrower it won't display all 5 on one line but two

      Delete
  4. Oops iImeant 3 stoires, 4 stories, or 5 stories.

    ReplyDelete
    Replies
    1. Yeah stories mean blog posts the widget will fish out of your archive

      Delete
    2. Alrightey then!

      http://calmlycookingcurry.blogspot.com/2016/02/anzac-biscuits.html

      Delete

Follow me on Instagram

Blog Archive