The
related posts widget it’s very important role in every blog and every website because
your visitor stay on your blog and website to very long time. So your blogger
impression and blogger traffic are increase day by day. But the blogger are not
available for this facility to the simple blog so I have to manually implement
this widget. If you have to add related post widget on your blog then don’t
search just follow my all the step and implement to your blogger.
Methods to Implements:-
1.
Now Logging to your blogger
Note: -
Backup your current template coding after you have to apply this process.
2.
Go to Dashboard---> Template ---> Edit
HTML
3.
Press CTRL+F in the code window and find </head> this code.
4.
Copy below Code and paste in above/Before </head> this code.
<b:if cond='data:blog.pageType == "item"'><style type='text/css'>
#related-posts {
margin: 10px 5px;
padding:5px 5px;
}
#related-posts h2 {
font-size: 18px;
color: black;
margin-bottom: 15px;
}
#related-posts a {
font-size: 14px;
color: #000000;
text-transform: Georgia;
}
#related-posts a:hover {
text-decoration: none;
color: #555555;
}
#related-posts ul {
list-style-type: none;
margin: 0 0 0px 0;
padding: 5px;
}
#related-posts ul {
list-style-type: none;
background: #ffffff;
border-left: 6px solid #e2e2e2;
}
#related-posts li {
padding: 12px;
border-bottom: 2px dotted #E2E2E2;
}
#related-posts li:hover {
background: #F4F4F4;
font-weight:bold;
}
</style>
<script type='text/javascript'>
var relatedpoststitle="Related Posts";
</script>
<script src='http://helplogger.googlecode.com/svn/trunk/related_posts.js' type='text/javascript'/>
</b:if>
#related-posts {
margin: 10px 5px;
padding:5px 5px;
}
#related-posts h2 {
font-size: 18px;
color: black;
margin-bottom: 15px;
}
#related-posts a {
font-size: 14px;
color: #000000;
text-transform: Georgia;
}
#related-posts a:hover {
text-decoration: none;
color: #555555;
}
#related-posts ul {
list-style-type: none;
margin: 0 0 0px 0;
padding: 5px;
}
#related-posts ul {
list-style-type: none;
background: #ffffff;
border-left: 6px solid #e2e2e2;
}
#related-posts li {
padding: 12px;
border-bottom: 2px dotted #E2E2E2;
}
#related-posts li:hover {
background: #F4F4F4;
font-weight:bold;
}
</style>
<script type='text/javascript'>
var relatedpoststitle="Related Posts";
</script>
<script src='http://helplogger.googlecode.com/svn/trunk/related_posts.js' type='text/javascript'/>
</b:if>
5.
Press CTRL+F in the code window and find <div class='post-footer'> this code.
6.
Copy below Code and paste in before <div class='post-footer'> this code.
<b:if
cond='data:blog.pageType == "item"'><div
id='related-posts'> <b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'> </b:if>
<b:if cond='data:blog.pageType == "item"'> <script
expr:src='"/feeds/posts/default/-/" + data:label.name +
"?alt=json-in-script&callback=related_results_labels&max-results=6"'
type='text/javascript'/></b:if></b:loop>
<script
type='text/javascript'> var maxresults=6; removeRelatedDuplicates();
printRelatedLabels("<data:post.url/>");
</script><a style="font-size: 10px; color: #bcbcbc; float:
right;" href="http://androhippo.blogspot.in"
rel="nofollow" >Get Related Post
widget</a></div></b:if>
7. Click on "Savetemplate"
0 Response to "How to Add Related Posts widget without thumbnail to blogger. "
Post a Comment