How to Make Related Post to Blogger Easy And Simple by rahmatfauzi08

VIEWS: 11 PAGES: 3

More Info
									                How to Make Related Post to Blogger Easy And Simple


In a website or blog, it is very important to have related post. With related post, site visitors will
see an interesting article the other without having to search. And if interesting, for sure visitors
will see the other article.

Talk related post, today I will give you tips and tricks for users to be able to make a related blog
post itself. How can it? refer to the steps below.

1. Blogger users must be logged in to your account.

2. Once logged in, select the Template menu ==> Edit HTML ==> Proceed ==> Check Expand
Widget Templates.

3. Find the code ]]> </ b: skin> in the template. To more easily find the code, do a search with
CTRL+F.

4. If it is found, copy and paste this code just above the code ]]> </ b: skin>.

/* Related Post */
.related_posts{margin-top:5px;padding:0 10px;border:1px solid
#B7E8FF;background:#E0F5FF;}
.related_posts h4{color:#111;font:normal 19px/19px Arial, sans-serif;letter-
spacing:-0.5px;padding:7px 0;border-bottom:solid 1px #fafafa;}
.related_posts a{color:#000;}
.related_posts ul{padding:0;}
.related_posts ul li{list-style:none;padding:4px 5px 4px 17px;border-bottom:1px
solid #f9f9f9;line-height:18px;background:url(http://4.bp.blogspot.com/-q-HyNrgjvAE
/TzQx3btIV4I/AAAAAAAABbU/PXVhFzfCOwg/s400/star.gif) no-repeat 0 7px;}

5. Then, looking back <div class='post-footer-line post-footer-line-1'>.

6. copy and paste the code below right back over <div class='post-footer-line post-footer-line-
1'>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='related_posts'>
<div class='widget-content'>
<h4>Related Post:</h4>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 10;
var maxNumberOfLabels = 2;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 2;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
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 &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;,
&quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default
/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
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 = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>

Preview to prevent errors in the template. If no error occurs, can directly save.

								
To top