22 Juli 2011

cara membuat artikel terkait dengan fungsi scroll

nah para sobat ada teman saya yg menanyakan bagaimana cara membuat artikel terkait dengan fungsi scroll..
OK deh saya akan jawab pertanyaan sob...
dan terimakasih telah usulnya bagi bang adi wijaya yang telah memberikan usulnya..
OK deh kalau gk sabar langsung aja gimana cara membuat artikel terkait dengan fungsi scroll



  • pertama masuk ke blog anda
  • pilih rancangan
  • edit HTML
  • centang expand widget templates
  • cari kode seperti ini <data:post.body/>
WARNING
TEKAN TOMBOL CTRL+F UNTUK MEMUDAHKAN PENCARIAN KODE
BAGI KALIAN YANG MENGGUNAKAN READ MORE AKAN MENEMUKAN 2 KODE PILIHLAH YANG PERTAMA
  • setelah itu copas kode di bawah ini tepat di bawah kode <data:post.body/> 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='similiar'><div style='border: 0px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 300px; background-color: #fcf7f7;'><div class='widget-content'><h3>Artikel Terkait Lainnya Seputar:</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;
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;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>

</div>
</b:if>

  • setelah itu cari lagi kode ]]></b:skin> 
  • dan copas lagi kode di bawah ini
.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);}

  • nah tinggal satu langkah lagi ini sangat penting
  • klik tombol SAVE dan lihat hasilnya
{}semoga bermanfaat{}

3 komentar:

Adi Wijaya mengatakan...

thanks bnget gan tricknya...ane udah coba dan udah berhasil..cmn ane gk tau pasang spya ada bordernya.... emmpp tp tampilannya udah bagus...

jadi thanks bnget infonya...sngat bermanfaat..oya link nya udah ane pasang gan...

Tips-Triks mengatakan...

@Adi WijayaYa sob itulah indahnya berbagi...
kalau mau ada bordernya artikelnya harus banyak sob..

libra blog mengatakan...

visit back kawan.. jangan lupa comment
salam blogger

Naxzapram Blog | Template by - Abdul Munir - 2008 - layout4all