![]() |
Membuat satu halaman posting menjadi beberapa halaman |
Bedanya, jika di Wordpres bisa dijalankan otomatis. Di Blogger, cara membagi postingan jadi beberapa halaman bisa sukses jika dilakukan secara manual. Lumayan ribet tapi sangat bisa. Kiaiblogger.com pernah mencoba cara membuat next page di Blogger ini di blog Tentangdoa.com dan berhasil alias wushul ila ghoyah (sampai tujuan). Hehe.
Mau membagi postingan menjadi 2 halaman atau lebih? Itu tidak masalah. Mau dibagi sampai 10 halaman juga bisa.
Pertama-tama, cara membuat satu halaman posting menjadi beberapa halaman ini adalah antum harus membaca bimilllah dulu biar tenang. Jangan lupa kopi dan rokoknya disiapkan dulu. Copas tulisan antum yang akan dipost itu ke Notepade dulu, utuh yah.
Jika misal tulisnnya sampai 3000 kata, bagi saja jadi 3 halaman yang per halaman ada 1000 kata. Ini kode membuat halaman pagination pada postingan antum tersebut.
<div class="content_1">
DISINI POSTING HALAMAN 1000 KATA (1000)
</div>
<div class="content_2" style="display:none;">
DISINI POSTING HALAMAN 1000 KATA BERIKUTNYA (2000)
</div>
<div class="content_3" style="display:none;">
DISINI POSTING HALAMAN 1000 KATA BERIKUTNYA (3000)
</div>
DISINI POSTING HALAMAN 1000 KATA (1000)
</div>
<div class="content_2" style="display:none;">
DISINI POSTING HALAMAN 1000 KATA BERIKUTNYA (2000)
</div>
<div class="content_3" style="display:none;">
DISINI POSTING HALAMAN 1000 KATA BERIKUTNYA (3000)
</div>
Tulisan yang ada di Notepad tadi ambil per 1000 katanya, masukkan ke masing-masing halaman yang sudah dibagi menjadi tiga tersebut.
Jika sudah rampung dikerjakan di Notepade, tambahi kode di bawahnya </div> (warna biru) pada paling akhir halaman ketiga terakhir itu, dengan kode berikut ini.
<p style="font-weight:bold;">Pages:
<a href="#" class="button_1"> 1</a>
<a href="#" class="button_2"> 2</a>
<a href="#" class="button_3"> 3</a></p>
<a href="#" class="button_1"> 1</a>
<a href="#" class="button_2"> 2</a>
<a href="#" class="button_3"> 3</a></p>
Kode di atas adalah koding blog di bawah postingan yang akan di klik pembaca jika ingin melanjutkan membaca artikel postingan selanjutnya, karena sudah terbagi menjadi Page 1, Pages 2 dan Pages 3 (terakhir).
Cara Membagi Postingan Blog
Advertisement
Setelah semua yang ada di page diatur semua, buka Blogger -> Postingan -> HTML (Jangan Compose yah) -> Copy -> Paste ke kotak postingan Blogger mode HTML tadi.
Atur label blog, permalink, lokasi postingan, deskripsi beserta judul postingan. Jika sudah beres semua, publikasikan post yang sudah dicopas dari mode HTML tadi. Postingan beserta kode tersebut akan berjalan dan it's work jika template antum semua ditambah kode di bawah ini:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript"></script>
<script style="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').show('slow');
jQuery('.content_2').hide('slow');
jQuery('.content_3').hide('slow');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').hide('slow');
jQuery('.content_2').show('slow');
jQuery('.content_3').hide('slow');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').hide('slow');
jQuery('.content_2').hide('slow');
jQuery('.content_3').show('slow');
return false;
});
});
</script>
<script style="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').show('slow');
jQuery('.content_2').hide('slow');
jQuery('.content_3').hide('slow');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').hide('slow');
jQuery('.content_2').show('slow');
jQuery('.content_3').hide('slow');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').hide('slow');
jQuery('.content_2').hide('slow');
jQuery('.content_3').show('slow');
return false;
});
});
</script>
Taruh kode di kotak box HTML Kiaiblogger.com tersebut tepat di atas kode </body> pada template blog antum masing-masing.
Perhatikan yang ditulis kiai dengan warna merah. Hilangkan saja jika di template blog antum semua sudah terdapat kode JQuery sebelumnya. Cara ceknya:
Ctrl + F saat buka template blog antum semua, lalu ketik "googleapis.com". Jika sudah ada kode JQuery yang lebih tinggi versinya dari 1.8.1, misal ada kode JQuery di template blog 2.1.2 atau 2.2.1, maka hapus saja kode yang diberi warna merah di atas.
Jika sudah dikerjakan semua, dan dicek berhasil, ucapkan Alhamudulillah. Demo Cara Membuat Satu Halaman Posting Menjadi Beberapa Halaman di Blogger, silakan cek di postingan ini: Makna, Hakikat dan Manfaat Dzikir Kepada Allah Swt. [kiaiblogger.com]