Cara Menciptakan Artikel Terkait Dengan Fungsi Scroll

Cara Memasang Artikel Terkait Dengan Fungsi Scroll | kali ini akan membahas seputar tutorial blog, yaitu memasang related post dibawah posting artikel dengan scroll, Kenapa memakai Scroll? Alasan yang sempurna yang dapat aku berikan yaitu biar dapat menghemat ruang dan tempat, dengan begitu akan terlihat simple dan minimalis. 
Cara Membuat Related Post Secara Otomatis Dengan Scroll pada script kali ini akan menampilkan Label atau Kategori dengan jumlah yang kita inginkan. Dan akan dibagi menurut Label / Katergori yang sudah dimasukan pada artikel tersebut. Misalnya dalam satu postingan anda memasang 3 atau lebih kategori, maka pada bab artikel terkait itu akan menampilkan semua kategori yang dimasukan. teori memang bikin pusing pribadi aja deh kita praktekin.

CARA MEMASANG ARTIKEL TERKAIT DENGAN FUNGSI SCROLL

Berikut ini yaitu langkah-langkah Cara Membuat Related Post Dengan Fungsi Scroll :
1. Buka Blogger
2. Setelah itu klik Elemen – Template – pilih Edit HTML (disarankan backup template terlebih dahulu)
3. Carilah instruksi berikut (gunakan CTRL + F untuk mempermudah pencarian)

<div class=’post-footer-line post-footer-line-1′> 

4. Apabila anda menemukan dua instruksi yang sama menyerupai diatas, pilihlah yang pertama.
5. Langkah selanjutnya copy instruksi dibawah ini

<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<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 = 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;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>

6. Paste instruksi diatas, sempurna di bawah kode

<div class=’post-footer-line post-footer-line-1′>

7. Klik Simpan. Lalu lihat hasilnya.
8. Finish

Keterangan :

Artikel Terkait: bisa anda ganti judulnya sesuai selera ( referensi : Related Post, artikel yang berhubungan, dll ) atau anda juga dapat menghapusnya kalau tidak ingin menampilkan judul label.
Sekian Tips kali ini yang berjudul Cara Membuat Artikel Terkait Dengan Fungsi Scroll bagi yang masih kurang paham atau belum terang dan ingin tanya-tanya lebih dalam. dapat tinggalkan jejak kalian dibagian komentar, selamat mencoba dan semoga berhasil.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *