News Update :

Cara Membuat Artikel Terkait di Blog Dengan Scroll

22 April 2010

Bismillah, salam ukhuwah untuk sobat bloger semua, sedikit kulasan tentang Tutorial Blog yang akan saya sharingkan ke temen semua tentunya dimana saya berhasil mencobanya disitulah saya akan membagikan ke sobat semua, tentu yang akan saya bagikan sudah pernah disharingkan lagi oleh sobat bloger semua, namaun disini akan saya sharingkan lagi untuk melengkapi tutorial blog dalam blog ini, jika sobat yang belum memakai Artikel Terkait dalam blog bisa dicoba cara2 yang saya dapatkan ini, ngomong2 masalah Artikel Terkait ini saya dapatkan dari salah satu sobat bloger yaitu Mas Oktri, nah untuk itu langsung aja menuju TKP di mana script itu berada :


SEPERTI INI GAMBARNYA ARTIKEL TERKAIT


Silahkan sobat klik Tata Letak kemudian Edit HTML dan jangan lupa centang Expand Template Widged, kemudian silahkan cari kode ini <data:post.body/> urutan yang kedua bukan yang pertama, Jika sudah ketemu silahkan letakkan kode di bawah di bawah kode diatas untuk urutan yang ke DUA, ingat urutan yang kedua karena di dalam template ada dua kode yang sama seperti kode diatas :
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Artikel Terkait:</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'>
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>


Selanjutnya silahkan sobat cari kode ]]></b:skin>
Jika sudah ketemu silahkan Copas kode dibawah ini dan letakkan di atas kode ]]></b:skin>
.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);}


Jika sudah silahkan sobat ganti warna background yang sobat suka
Dan silahkan sobat simpan, lihat hasilnya...


Selamat Mencoba Semoga Sobat Berhasil
Share this Article on :

2 komentar:

Rudy Hartono mengatakan...

makasih infonya sangat bermanfaat sekali untuk yang belum pasang, nice share and happy blogging

Jaka Surya mengatakan...

salam kenal sob

Posting Komentar

Assalamu'alaikum sobat semua...jika sobat sudah mampir di blog saya jangan lupa komentarnya ya,,,mohon saran dan kritiknya, karena setetes komentar anda sangat berarti untuk kemajuan blog ini, Terima kasih semua. SALAM BLOGGER

 

© Copyright Q Ingin Bisa 2010 -2011 | Design by Herdiansyah Hamzah | Published by Borneo Templates | Powered by Blogger.com.