Showing posts from December 18, 2016

In this instructional exercise im going to clarify, how to include blogger related connection list underneath posts.So, this is the correct one of codedforum.com.ng related post. without design, By utilizing this trick,It keeps your perusers in your site too long.It more vital for increment online visits and SEO as well.Few weeks prior i posted about Thumbnail View With Related Post For blogger. In this way, the individuals who are not keen on connections style, you can go for thumbnail impact.

Each means are clarified well.If you have an issue, recently remark below.And im not going to make new demo for this instructional exercise like i do.You can get a demo, end of this article.happy blogging. :)

The most effective method to Add Blogger Related Links to Below Blog Posts

1. Go to Blogger Dashboard > Template

2. Reinforcement your layout

3. Tap on Edit HTML

4. Find ]]></b:skin> and include underneath code just beneath it

/* The CSS Code for the menu starts here codedforum.com.ng

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts .widget{
padding-left:6px;
margin-bottom:10px;
}
#related-posts .widget h2, #related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;}
#related-posts a{color:#0c0080;}
#related-posts a:hover{color:#0ab0fd;}
#related-posts ul{
list-style-type:none;
margin:0 0 0px 0;
padding:0px;
text-decoration:bold;
font-size:12px;
text-color:#000000
}
#related-posts ul li{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi03oTiLV1YAeAF_Hm8JOh84x1iSjq0w-uIg0BVtQWZTmWQ_S-KlP6ettv6PAskh_SFDgciYPvia0hESqonyrm5uQAcAPwHwKptjSwVz-F5ceuK8aVfZ88SvEKLigbLoMkkbUEqLxQE4Yc/s1600/btrix_arrow-icon.png) no-repeat ;
display:block;
list-style-type:none;
margin-bottom: 13px;
padding-left: 30px;
padding-top:0px;
height: 20px;
margin-top: -5px;}

#related-posts ul li:hover{
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdUNWD5ThOSM7WWFOGX54-DxjYHvQw7rrUoKk2Qduzz-XCXRzsg3tGHqOtKljN70KuBMVhHX-nuOlhNWbuu8vcNu7ozybf6hgoEBkm539xHXjG2CopABFgDCq3qwO-5YrLzROrNmQDP_8/s1600/btrix_arrow-icon2.png) no-repeat ;
display:block;
list-style-type:none;
margin-bottom: 13px;
padding-left: 30px;
padding-top:0px;}</style>

. Again Find <div class='post-footer-line post-footer-line-3'> and add below code just below it

<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=10;
removeRelatedDuplicates(); printRelatedLabels("<data:post.url/>");
</script>
</div>
</b:if>

You can change maxresult as your like ( what number of related presents require on unmistakable)

8. Presently spare your Template.

You are finished. In the event that you have any issue identified with How to Add Blogger Related Links to Below Blog Posts. Simply leave a comment.I will help to you.

CDF

Showing posts from December 18, 2016

Instructions to Add Blogger Related Links to Below Blog Posts

Trending Post

Instructions to Add Blogger Related Links to Below Blog Posts

Archive