Wednesday, 21 June 2017

Blogger's Corner: Increasing Site Engagement


Are you interested in trying to get your blog visitors to read multiple posts once they are on your site? If not, you should be - you made all that effort to get them there so it's good to get them to see as much of your content as possible...

However, it is important to identify what content they want to see through presenting content options to them that are related to what made them click through to your blog in the first place.


Increasing the time people spend on your site & the number of posts they view

From my experience over the last few months, I've found that there are a couple of ways that can help you to start looking at increasing how long people spend on your site AND how many posts they view during their time on your blog. 

At the start of April, I set up a new Goal in my Google Analytics to record every time a user view three or more posts. The chart below shows how implementing some of these initiatives can really boost both of these metrics - just click the chart to make it bigger!

Goal Completions


So what have I done?

Related Content

I'd be surprised if you don't already have something similar in place on your own blogs, but if you don't you can get something going very quickly, and very easily. 

My blog user the Blogger platform, but on WordPress you can get an instant plugin widget that enables you to one-click install with your existing blog.

For those of you on Blogger, or wanting a little more flexibility on customising how your related content sits, you can use a bespoke code.

Related blog content

You'll see on my related content, I also chose to give it a title so that users would know why they have been presented with these four boxes of content, and also to give a call to action as to what I would like them to do.

All I did was to make friends with Google, searching 'related content on my blog', and I found 100's of blog posts and step by step instructions on how to add it into your own site. I followed the instructions for adding related content on Helplogger.

Give it a go - it looks a muddle and complex at first but the step by step walk throughs really are a great support, and means anyone can do it. If you get stuck, there are plenty of forums about to post any specific needs you have too - don't be frightened to post in them! 😉

Featured Post

Again, this is a widget that I've had included on my site for longer than I've seen the goal completions increase, but I do think it adds value by directing users to an important piece of content or a focus to your blog that is no longer the most recent post.

There's two ways that you can do this - you can have it as a sidebar widget or within the main feed of your content. & as always, there are pros and cons to both.

I use a basic free template from Blogger for my site, meaning that my responsive site isn't all that flexible. You can see from the below that neither my sidebar nor my featured post sit on my site when viewing on a mobile. It's actually quite annoying if I'm honest, but at this stage, it is less of an issue that a move to a new template!

Desktop site view
Desktop view of a featured post - showing in the sidebar & main content feed

Mobile site view
Mobile view without any featured posts
Obviously, the above desktop view shows a duplication of posts - I have only added the one in my main feed to demonstrate how it is pulled through. I usually use my sidebar, however you could use the two spaces to pull through two different bits of content.

So how do I add it? 

Blogger has a plugin, that's almost a one-click install. 
  • Go to Layout
  • Click to Add a Gadget
  • In the pop up window, make your selection of what you want to show and the post you want to use
  • Drag and drop it to where you want it - you can place it anywhere; sidebar, main, footer...
This is really easy and quick to install, and is a good way to get going, however, for something more flexibility to be customised, my sidebar uses a Custom HTML gadget. 

Don't run away in fear - it's really easy (& it might be possible in WordPress too - I'm not sure)

  • Go to Layout
  • Click to Add a Gadget
  • In the pop up window, give it a title (FEATURED POST, for example)
  • Copy this code, changing the 'XXXX' for the link to the post, and the 'ZZZZ' for a link to the image (you'll need to upload your image if it isn't in your post)

    <a href="XXXX"><img src="ZZZZ" height="403" width="266" align="center"; /></a>
  • Change the height & width dimension to what's right for the area you want to include it in. Some of this will be bound by the template that you use.
Using the custom HTML option means that your image is clickable (the first method wasn't). You can also add more HTML to include the title and a text summary if you like.

For anyone on WordPress, there are a number of Featured Post plugins that you can install.

Popular Posts

You definitely should include these - they are already posts that resonate well with your users so make sure others can get to them easily to enjoy them too!

Top tip: Don't "fake" your popular posts, use a widget or plugin that genuinely figures out what are popular posts, whether that based on views, comments, shares etc...

Blogger has a very simply gadget, aptly called Popular posts, however, it's not very good unless it's in the sidebar, in my experience. Mine sits there about mid-way down.  All you need to do is make a selection about the date range it pulls posts from, whether you want just the image and post title or a copy summary, and how many you want to show. 

Popular post content


Just head to the Layout section within the Blogger interface to get started!

WordPress offers a Popular Post plugin, but I've no experience of using it, so can't advise on how to implement it or how to use it.

Internal Linking

Firstly, I don't mean this to just link to as many old posts as you can, but contextually considering linking back to posts in new content can have engagement benefits as well as SEO advantages.

I've stepped this up in the last 4-6 weeks across my content, carefully considering where, what and how I link back to my previous content.

One way I find quite easy to do this is within my round up posts. I created these 18 months or so ago to be a summary of all we'd been up to, so as you create these, don't just rewrite about the competition you went to or how well a lesson went, link back to your original post about it.

Make sure you do consider what posts you're linking to & don't just do it for the sake of it. This can be very off putting to reader, particularly if your post is stuffed full of links back to posts, requiring them to click back and forth to get the full story/point of your post. If you don't think you have an appropriate post to link back to, don't add one!

Give it a go next time...

Search Box

One very annoying limitation of Blogger - there is no good search bar gadget... 😠

However, if you are using Blogger, or are on any other blogging platform, you can install a custom HTML widget to allow users to full search your content.

Search box functionality


Why would you want to allow users to do this?

Well, let's say they are a returning visitor and want to go back to something they read in the past, it provides a quick and easy way for them to find it in amongst all your content. It also allows new visitors to see if you've got content on a specific topic.

My search box sits at the top of my sidebar, and I'm sure with some clever coding, it could be more dynamic and responsive - such as full width or following you down the page. But I haven't invested much additional time into it for two reasons: a) it doesn't show within my mobile template, b) desktop views of my site are less than half (38%)

My search box code is at the very bottom of this post if you would like to use it - I've highlighted the bits I customised 👇

Content Tags

Most of you will already use content tags when you create your posts, but do you know what they are for and how they can help? 

They basically group your content. For example, all the events I attend on foot, I tag with 'events'. A user can then click on my tags if they like my post to see more of that type. It also creates a URL for all the content, so as I mentioned above, if you want to link internally to a topic within a post, you can. 

You can actually see this in practice at the top of this page, where I link to all the posts that are part of the Blogger's Corner section: http://www.teamtunnaheventing.co.uk/search/label/bloggers%20cornerhttp://www.teamtunnaheventing.co.uk/search/label/bloggers%20corner

I choose to display my content tags at the end of every post - some bloggers do it as the top, or under the headline. I've not really tested the best placement, but it's a very quick and easy way to not only organise your content but also to allow a simple way for users to find more related content on a very specific type of content.

If you're not already using it, give it a go!

Content tags

Found this post useful? Please pin it to share it for others to enjoy!


Coding for the search box that sits on my site:

<style>
#searchbox {
    background: #eeaa00;
    border: 4px solid #000000;
    padding: 5px 5px 5px 5px;
    width: 250px;

}
input:focus::-webkit-input-placeholder {
    color: transparent;
}
input:focus:-moz-placeholder {
    color: transparent;
}
input:focus::-moz-placeholder {
    color: transparent;
}
#searchbox input {
    outline: none;
}

#searchbox input[type="text"] {
    background: url(http://2.bp.blogspot.com/-xpzxYc77ack/VDpdOE5tzMI/AAAAAAAAAeQ/TyXhIfEIUy4/s1600/search-dark.png) no-repeat 10px 6px #fff;
    border-width: 0px;
    border-color: #fff;
    font: italic 12px Calibri;
    color: #888888;
    width: 188px;
    padding: 8px 30px 8px 30px;

}
#button-submit {
    background: #888888;
    border-width: 0px;
    padding: 9px 0px;
    width: 225px;
    cursor: pointer;
    font: 14px Calibri;
    color: #fff;
    text-shadow: 0 px 0 #555;
}
#button-submit:hover {
    background: #4f5356;
}
#button-submit:active {
    background: #5b5d60;
    outline: none;
}
#button-submit::-moz-focus-inner {
    border: 0;
}
</style>
<form id="searchbox" method="get" action="/search">
<input name="q" type="text" size="5" placeholder="Type & hit enter to search"/>
</form>

No comments:

Post a Comment