Cara Terbaru Membagi Postingan Blog Menjadi Beberapa Halaman

anakforum blog    3:09:00 PM    Ngeblog , Tutorial    6 comments   

Cara membuat postingan blog menjadi beberapa halaman. kali ini saya akan membagi sedikit tips supaya artikel sobat bisa dibagi bagi menjadi beberapa halaman.

blogger sendiri tidak memiliki fitur ini, jadi agak menyulitkan kita jika ingin membagi postingan blog menjadi beberapa halaman. 

anakforum

dari fitur ini, artikel sobat terilihat lebih simple dan pembaca tidak akan merasa bosan dan terus penasaran tentang page selanjutnya. langsung saja kita ke tutorialnya


pertama copy dan paste code dibawah ini sebelum code </body>

<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'); }); 
jQuery('.button_4').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').show('slow'); jQuery('.content_5').hide('slow'); jQuery('.content_6').hide('slow'); jQuery('.content_7').hide('slow'); jQuery('.content_8').hide('slow'); jQuery('.content_9').hide('slow'); jQuery('.content_10').hide('slow'); }); 
jQuery('.button_5').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').hide('slow'); jQuery('.content_5').show('slow'); jQuery('.content_6').hide('slow'); jQuery('.content_7').hide('slow'); jQuery('.content_8').hide('slow'); jQuery('.content_9').hide('slow'); jQuery('.content_10').hide('slow'); }); 
jQuery('.button_6').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').hide('slow'); jQuery('.content_5').hide('slow'); jQuery('.content_6').show('slow'); jQuery('.content_7').hide('slow'); jQuery('.content_8').hide('slow'); jQuery('.content_9').hide('slow'); jQuery('.content_10').hide('slow'); }); 
jQuery('.button_7').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').hide('slow'); jQuery('.content_5').hide('slow'); jQuery('.content_6').hide('slow'); jQuery('.content_7').show('slow'); jQuery('.content_8').hide('slow'); jQuery('.content_9').hide('slow'); jQuery('.content_10').hide('slow'); }); 
jQuery('.button_8').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').hide('slow'); jQuery('.content_5').hide('slow'); jQuery('.content_6').hide('slow'); jQuery('.content_7').hide('slow'); jQuery('.content_8').show('slow'); jQuery('.content_9').hide('slow'); jQuery('.content_10').hide('slow'); }); 
jQuery('.button_9').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').hide('slow'); jQuery('.content_5').hide('slow'); jQuery('.content_6').hide('slow'); jQuery('.content_7').hide('slow'); jQuery('.content_8').hide('slow'); jQuery('.content_9').show('slow'); jQuery('.content_10').hide('slow'); }); 
jQuery('.button_10').click(function(){ jQuery('.content_1').hide('slow'); jQuery('.content_2').hide('slow'); jQuery('.content_3').hide('slow'); jQuery('.content_4').hide('slow'); jQuery('.content_5').hide('slow'); jQuery('.content_6').hide('slow'); jQuery('.content_7').hide('slow'); jQuery('.content_8').hide('slow'); jQuery('.content_9').hide('slow'); jQuery('.content_10').show('slow'); return false; }); });
</script>

selanjutnya kita copy kode dibawah ini  di MODE HTML (sebelah menu COMPOSE)

<div class="content_1"> Masukan artikel kamu 1 </div>
<div class="content_2" style="display: none;"> Masukan artikel kamu 2 </div>
 <div class="content_3" style="display: none;"> Masukan artikel kamu 3 </div>
 <div class="content_4" style="display: none;"> Masukan artikel kamu 4 </div>
<div class="content_5" style="display: none;"> Masukan artikel kamu 5 </div>
<div class="content_6" style="display: none;"> Masukan artikel kamu 6 </div>
 <div class="content_7" style="display: none;"> Masukan artikel kamu 7 </div>
 <div class="content_8" style="display: none;"> Masukan artikel kamu 8 </div>
 <div class="content_9" style="display: none;"> Masukan artikel kamu 9 </div>
<div class="content_10" style="display: none;"> Masukan artikel kamu 10 </div>
 <div style="font-weight:bold;">Pages: <a class="button_1" href="#">1</a>

 <a class="button_2" href="#">2</a> <a class="button_3" href="#">3</a>
 <a class="button_4" href="#">4</a> <a class="button_5" href="#">5</a>
<a class="button_6" href="#">6</a> <a class="button_7" href="#">7</a>
 <a class="button_8" href="#">8</a> <a class="button_9" href="#">9</a>
<a class="button_10" href="#">10</a>
</div>

sobat masih bisa memodifikasinya sendiri sesuka hati sobat, nah itu saja tutorial dari saya, semoga berhasil :)

maaf kami tidak menayangkan LIVE DEMO