Cara Membuat Pagination/Potong Artikel di Blogspot

Posted on

Setelah mondar mandir ke sana kemari tentang cara membuat pagination/potong artikel di blogspot, tak satupun artikel yang benar-benar mengupas secara tuntas bagaimana membuat pagination di postingan blogspot, beda halnya dengan Wp (WordPress) yang sangat mudah sekali membuat pagination di postingan artikel.

Kalian juga yang membaca artikel ini pasti sudah mengetuhi bagaimana cara membuat pagination di wordpress, tapi.. belum tentu kalian bisa membuat pagination di blogspot, kenapa saya bilang kalian belum tentu bisa? ya.. karena kalian mampir ke blog ini. Hahaha Kidding bos

Cara Membuat Pagination/Potong Artikel di blogspot

Cara Potong Potong Artikel di Blogspot
Cara Potong Potong Artikel di Blogspot

Sebelum melanjutkan ke pembahasan cara membuat pagination/potong artikel di blogspot, saya mau minta maaf karena telah membuat judul yang kurang relevan dengan isi artikel, karena yang akan saya bahas ini adalah expand atau membuat sebagian artikel menjadi tersembunyi dan apabila di klik akan terbuka.

Artikel ini saya tujukan khusus untuk para pemain Google Adsense yang sering mempermasalahkan PV dari UV/day, karena kebanyakan dari visitor yang datang ke blog moneysite akan menutup blog ketika sudah selesai membaca artikel, nah dengan cara yang akan saya share ini Insya Allah jumlah page view blog kalian akan meningkat. Dan tanpa panjang lebar silahkan baca artikel ini sampai tuntas.

1. Buka Blogger.com, kemudian masuk bagian edit template lalu pastekan kode di bawah ini di bawah <head> atau di atas </head>

<script src=’//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js’ type=’text/javascript’/>
<script type=’text/javascript’>
jQuery(document).ready(function(){
jQuery(&#39;.button_1&#39;).click(function(){ location.reload(true)
jQuery(&#39;.content_1&#39;).fadeIn(&#39;slow&#39;);
jQuery(&#39;.content_2&#39;).fadeOut(&#39;fast&#39;);
jQuery(this).css(&#39;background&#39;,&#39;#F4655F&#39;);
jQuery(this).css(&#39;color&#39;,&#39;#fff&#39;);
jQuery(&#39;.button_2&#39;).css(&#39;background&#39;,&#39;#fff&#39;);
jQuery(&#39;.button_2&#39;).css(&#39;color&#39;,&#39;#F4655F&#39;);
return false;
});
jQuery(&#39;.button_2&#39;).click(function(){
jQuery(&#39;.content_1&#39;).fadeOut(&#39;fast&#39;);
jQuery(&#39;.content_2&#39;).fadeIn(&#39;slow&#39;);
jQuery(this).css(&#39;background&#39;,&#39;#F4655F&#39;);
jQuery(this).css(&#39;color&#39;,&#39;#fff&#39;);
jQuery(&#39;.button_1&#39;).css(&#39;background&#39;,&#39;#fff&#39;);
jQuery(&#39;.button_1&#39;).css(&#39;color&#39;,&#39;#F4655F&#39;);
return false;
});
});
</script>

2. Hapus <data:post.body/> lalu ganti dengan kode di bawah ini

<style>
.post-pagination {
margin: 20px auto;
text-align: center;
width: 100%;
}
.button_1, .button_2 {
border: 2px solid #f4655f;
font-weight: 900;
padding: 6px 36px;
color:#f4655f;
transition:ease 0.69s !important;
}
.button_1:hover, .button_2:hover:hover {
background: none repeat scroll 0 0 #f4655f;
color: #fff;
text-decoration: true;
}
</style>
<div class=’artbody’ itemprop=’articleBody description’><div expr:id=’&quot;page1&quot; + data:post.id’/>
<div style=’clear:both; margin:10px 0′>
<div class=’content_2′ style=’display: none;’>
<div expr:id=’&quot;page2&quot; + data:post.id’><data:post.body/></div>
<script type=’text/javascript’>
var obj0=document.getElementById(&quot;page1<data:post.id/>&quot;);

var obj1=document.getElementById(&quot;page2<data:post.id/>&quot;);
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(&quot; &quot;);
if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+1);}
</script>
</div>
</div>
<br/><div class=’post-pagination’>
<a class=’button_1′ href=’#’>SELANJUTNYA</a>
<a class=’button_2′ href=’#’>2</a>
</div>
</div>

Hasilnya akan seperti ini

Tips Menambah Page View Blog
Tips Menambah Page View Blog

Penjelasan:

Jika kata selanjutnya seperti pada gambar di atas di klik, maka halaman blog kalian akan reload/refresh sementara apabila angka 2 yang di klik maka menampilkan sebagian artikel yang terpotong/tersembunyi.

Selanjutnya berharap dan berdoa agar si visitor klik “SELANJUTNYA” sebelum klik angka “2”. Hahaaa :v

Ok, cukup sekian artikel kali ini, jika ada yang mau ditanyakan silahkan tinggalkan pertanyaannya di kolom komentar, seperti biasa, silahkan share artikel ini jika menurut kalian bermanfaat.

Leave a Reply

Your email address will not be published. Required fields are marked *