Hi Bloggy readers,
There are lots of things that we can do in order to increase the number of pageviews of our blog, for example, you can add Recent Posts widget, Popular Posts widget, or you can also put related links inside your post that will bring visitors to another articles in your blog. But, there is one other important widget that can help you get more pageviews from visitors, and that is called "Related Posts Plugin".
Anyway, in my previous article - How to Create a Related Posts Plugin below the Blog Post? - i already uncovered to you about how to add a related posts plugin on the bottom position of our blog.
But if you don't feel any impact in the increasing of your blog pageviews, you might consider to move this related posts plugin to another position of your post. Okay, in this post, i want to show you how exactly to move the related posts plugin to the top position, to be exact, below the post title area.
1. Log in to Blogger
Now head first to Blogger website via the URL address http://www.blogger.com and enter to your Blogger Account.
2. Go to Edit HTML
After landing to the Dashboard page, now press Layout/Design and right after that, switch the sub-tab to Edit HTML.
Just in case if later you want to revert back the template to normal again, now save your current template to make a back up template.
As you can see on the top of HTML box, there is a small box called "Expand Widget Template". Now give a tick/check mark on that small box.
4. Find the Code
By pressing Ctrl + F at the same time, now find the code section below in your blog template:
5. Paste the related posts plugin script
Now block all the script code below, and then, press copy. After that, paste it among the code <p> and the code <data:post.body/></p>.
As you can see in that script code above, there are some certain configuration that can be applied to the related posts plugin. For example, now pay attention at the codes in red.
- The widget position can be adjusted to the right position by replacing the value "left" to "right" on the property float:left.
- The background of the widget title "Related Posts" can also be customized by changing "Related Posts :" to other title, such as "Related Article", "Related Posts Plugin" or anything.
- To change the background color, try edit the property background:#dfdfdf, and then to change the font color, edit the value inside the property color:black with any color value.
- The number of related articles that appear can also be modified by changing the value 5 inside the code "var maxNumberOfPostsPerLabel".
- The number of labels that appear on related posts plugin can be modified by changing the value 1 inside the code "var maxNumberOfLabels".
Now save the current changes by pressing the Save Template button.
As you can see in every article page of your blog, the related posts plugin has been successfully installed on your blog. Okay, that's it for now. If you have any question regarding the installation of Related Posts Plugin in your blog, you can leave your question on the comment section below.