Friday, November 18, 2011

how to add Related posts in blogs


Related post or postings linked Extremely Useful for Your Blog Mainly SEO. Related heading to work when your post will be displayed under the posts related to these postings that refer the reader to read a lot more in your blog that makes visitors feel at home to read more of your posts. for this time I will share with you two pieces related to your post

Note: THIS different from the use of links within a link karenra Within a random post work and had nothing to do with the post concerned and the use of labels in every post you



2. RELATED POST V1

1.login to your blog account click on the draft and edit html
click Expand Widget Templates
find code: <data:post.body/> Note: use CTRL F to find the code themselves

Copy the code below just below the code <data:post.body/>

Note: If you are using auto readmore there are 4 or 3 code you put this code in the code below the third see in the picture below






CODE:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Read other articles:</H2>
<div class='cayunbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid
#ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
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;albri&#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>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>


NOTE: Notice the red code "Read other articles" that you can change the name of desire





Next to setting CSSny but this depends on you want to wear or not here I do not pake Code CSS but I do not know for your template, you just input its CSS Code



now you find this code ]]></ b: skin> and you copy the code below the above code ]]></ b: skin>



. cayunbox {border: 1px solid # 000000; padding: 5px;

  background-color: # 7BFAAF;-moz-border-radius: 5px; margin: 5px;}

. cayunbox: hover {background-color: # CE44F0;}


then you save and see the result:





2. RELATED POST V2





1.login to your blog account click on the draft and edit html


click Expand Widget Templates


find this code: </ head> Note: use CTRL + F to search for code themselves


<script type="text/javascript">

//<![CDATA[

var relatedTitles = new Array();

var relatedTitlesNum = 0;

var relatedUrls = new Array();

function related_results_labels(json) {

for (var i = 0; i < json.feed.entry.length; i++) {

var entry = json.feed.entry[i];

relatedTitles[relatedTitlesNum] = entry.title.$t;

for (var k = 0; k < entry.link.length; k++) {

if (entry.link[k].rel == 'alternate') {

relatedUrls[relatedTitlesNum] = entry.link[k].href;

relatedTitlesNum++;

break;

}

}

}

}



function removeRelatedDuplicates() {

var tmp = new Array(0);

var tmp2 = new Array(0);

for(var i = 0; i < relatedUrls.length; i++) {

if(!contains(tmp, relatedUrls[i])) {

tmp.length += 1;

tmp[tmp.length - 1] = relatedUrls[i];

tmp2.length += 1;

tmp2[tmp2.length - 1] = relatedTitles[i];

}

}

relatedTitles = tmp2;

relatedUrls = tmp;

}



function contains(a, e) {

for(var j = 0; j < a.length; j++) if (a[j]==e) return true;

return false;

}



function printRelatedLabels() {

var r = Math.floor((relatedTitles.length - 1) * Math.random());

var i = 0;

document.write('<ul>');

while (i < relatedTitles.length && i < 20) {

document.write('<li><a href="' + relatedUrls[r] +
'">' + relatedTitles[r] + '</a></li>');

if (r < relatedTitles.length - 1) {

r++;

} else {

r = 0;

}

i++;

}



document.write('</ul>');

}

//]]>

</script>


2.Next you are looking for code <data:postLabelsLabel/>The full code like this:

<b:if cond='data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if> </b:loop> </b:if>


Next you delete the code and replace with the following code and save:



<b:if cond='data:post.labels'>

<data:postLabelsLabel/>

<b:loop values='data:post.labels' var='label'>

<a expr:href='data:label.url'
rel='tag'><data:label.name/></a><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&amp;callback=related_results_labels&amp;max-results=10"'
type='text/javascript'/>

</b:if>

</b:loop>

</b:if>



<p>

<h2>Baca
ini juga :</h2>

</p>



<script
type='text/javascript'>

removeRelatedDuplicates();

printRelatedLabels();

</script>



NOTE: actually you only need to add code that are red only easy but let me just change the code to 2 with a third code.

congratulations to try it when I hope this article helps to give me 1 or like facebook or join site and please your Commenting











2 comments:

  1. how to add Related posts in blog

    ReplyDelete
  2. I love it,Excellent article.I am decide to put this into use one of these days.Thank you for sharing this.Success!
    _______________________________________________________________________
    Cocktail Dresses|Maternity Wedding Dresses|Plus Size Mother of Bride Dresses

    ReplyDelete