Cara Membagi Posting Blog Menjadi Beberapa Halaman (Multiple Pages)

Cara Membagi Posting Blog Menjadi Beberapa Halaman (Multiple Pages)

Cara Membagi Posting Blog Menjadi Beberapa Halaman (Multiple Pages)
Cara Membagi Posting Menjadi Beberapa Halaman (Break Post In Multiple Pages)

Artikel panjang di blog kita bisa dibagi menjadi beberapa halaman atau beberapa bagian

Tujuan membagi posting menjadi beberapa halaman (multiple pages) ini adalah untuk meningkatkan pageviews. 

Namun, membuat posting menjadi beberapa halaman ini ini akan ngeselin pembaca, karena harus mereka harus klik beberapa kali jika akan membaca postingan berikutnya (Lihat DEMO).

Banyak situs berita menerapkannya untuk meningkatkan pageviws, terutama Tribunnews yang menang jagonya ngeselin pembaca dalam hal multiple pages dan judul umpan klik (clickbait headlines).

Cara Membagi Posting Menjadi Beberapa Halaman (Multiple Pages)

Pastikan ada kode ini di template blog Anda:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

CSS
Simpan di atas kode ]]></b:skin>

.post-pagination {margin: 40px auto;text-align: center;width: 100%;float:left;}
.button_1, .button_2, .button_3 {border: 2px solid #f4655f;font-weight: 900;padding: 6px 36px;
color:#f4655f;transition:ease 0.69s !important;}
.button_1:hover, .button_2:hover, .button_3:hover {background: none repeat scroll 0 0 #f4655f;color: #fff;text-decoration: none;}

JavaScript
Simpan di atas kode </head>

<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').fadeIn('slow');
jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').fadeOut('fast');
jQuery('.content_2').fadeIn('slow');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').fadeOut('fast');
jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeIn('slow');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
return false;
});
});
</script>

Save your template!
Simpan Template!

SAAT POSTING
Saat menulis postingan yang akan dipilah menjadi beberapa halaman, klik mode HTML.

Post > New post > klick mode HTML

Copas kode berikut ini:

<div class="content_1">
Posting Bagian Pertama di Sini
</div>
<div class="content_2" style="display: none;">
Posting Bagian Kedua di Sini
</div>
<div class="content_3" style="display: none;">
Posting Bagian Ketiga di Sini
</div>
<div class="post-pagination">
<a class="button_1" href="#">1</a>
<a class="button_2" href="#">2</a>
<a class="button_3" href="#">3</a>
</div>

Publish!

Demikian Cara Membagi Posting Blog Menjadi Beberapa Halaman (Break Post In Multiple Pages). Good Luck & Happy Blogging! (www.contohblog.com).*

Sumber

Related Posts

2 Komentar untuk "Cara Membagi Posting Blog Menjadi Beberapa Halaman (Multiple Pages)"

kalau untuk di wordpress gimana ya mas ? tanpa plugin

makasi gan infonya..

1. Komentar spam, menyertakan Link Aktif dan Alamat Blog tidak akan muncul.
2. Tidak semua pertanyaan sempat atau bisa dijawab.
3. Bagi yang mau tanya, sebelum bertanya, silakan cari dulu di Kotak Pencarian di Sidebar.
Thanks for visiting and the comment :)

Contact Form

Name

Email *

Message *