Beautiful Related Post

Related Post merupakan suatu artikel yang berkaitan dengan artikel yang kita posting. Biasanya ini berupa link yang diletakkan dibawah posting blog. Related Post biasa disebut juga dengan Posting Terkait, Link Berkaitan, Artikel pada Kategori yang Sama. Dengan adanya ini para pengunjung blog lebih mudah untuk mencari artikel yang kita posting tanpa harus membuka satu persatu posting. lebih detailnya lihat gambar berikut :

Bagaimana cara membuatnya? Berikut tutorialnya.

Langkah I

Login Blogger anda kemudian masuk Template -> Edit HTML -> Expand Widget Template Anda. cari kode ]]></ b: skin> kemudian copy paste kode berikut ini persis diatas kode ]]></ b: skin> :

 /*-----------------------------
post code related optimal
visit http://www.trik-tipsblog.blogspot.com
------------------------------*/
. rbbox (border: 1px solid rgb (192, 192, 192); padding: 5px;
background-color: # f0f0f0;-moz-border-radius: 5px; margin: 5px;)
. rbbox: hover (background-color: rgb (255, 255, 255);)

Kemudian anda cari kode <p><data:post.body/></p>
Biasanya kode ini terletak dibagian kita membuat Read More. Nah kalo sudah ketemu copy paste kode berikut ini dibawah kode <p><data:post.body/></p>

<b:if cond='data:blog.pageType == "item"'>
<H2> Related Articles: </ H2>
<div Class='rbbox'>
<div Style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div Id='albri'/>
<script Type='text/javascript'>
homeUrl3 var = "<data:blog.homepageUrl/>";
maxNumberOfPostsPerLabel var = 4;
maxNumberOfLabels var = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
listEntries10 function (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 ( 'albri'). appendChild (div1);
)
)
)
search10 function (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 ();
numLabel var = 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>
<script type="text/javascript"> RelPost ();</ script>
</ Div>
</ b: if>

 Selamat Mencoba. Happy BLogging with me

Posted by: Andi Setyoko

Berita Harian, Updated at: 11:05 PM