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:
<p><data:post.body/></p>
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>.
<b:if cond='data:blog.pageType == "item"'>
<div style='float:left;border:1px solid #dfdfdf;margin:5px;padding:5px;width:200px;font-size:small;'>
<div class='similiar'>
<div class='widget-content'>
<div style='background: #dfdfdf; color: black; text-align: left;'>
<span style='font-family: Verdana,sans-serif;padding:4px;'>Related Posts :</span>
</div>
<div class='boxx'>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 5;
var maxNumberOfLabels = 1;
maxNumberOfPostsPerLabel = 5;
maxNumberOfLabels = 1;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script></div>
</div>
</div>
</div>
<div style='float:right;font-size:x-small;'> <script src='http://slideshowtabonwhatmakesblog.googlecode.com/files/18ddf9445hjj345k3k4434ddeeDDdfDff333.js' style=''/></div>
</b:if>
- 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.
I'm Out...
You might also like to read :
Share This Article to Other People Across the World !
Thanks!
Get the fresh update from Whatmakesblog.com!
To get updates from this blog, just enter your email address in the below subscription form and then click Subscribe.
Your email address will not be shared to any third party
Delivered by FeedBurner
Labels:
Posts,
Related Posts Plugin
2 comments:
Thanks
and i removed labels and bullets as you said in other topics
but some times there is a problem for example
I opened my topic page and i find in related topics the same topic with other topics..
can we fix this problem ?
thank you
Dr Ibrahim
To ibrahim,
Can you explain to me more thoroughly about the problem you're having right now, cause i don't think i can get your point at all.
Anyway, if you look through my blog, on every article page, as you can see on the Related Articles widget of that page, you will see a different group of titles that of course, will appear based on the label name that has been set on that article. So if you set a label name "game", this widget will show you 5 or more title that have connection with the article with a label "game" in it. So, i don't see any problem with this widget, especially after being hacked (without bullet and label name).
Post a Comment