Cara Membagi Postingan Blog Menjadi Beberapa Halaman - Membuat satu halaman posting menjadi beberapa halaman di blog merupakan salah satu cara untuk meningkatkan pageview blog Anda. Pembagian halaman post biasanya dipakai oleh situs web yang menyediakan aneka macam informasi yang panjang, ibarat situs portal isu dan sebagainya.
Namun hal ini kembali lagi kepada Anda, kalau memang perlu membagi artikel atau postingan menjadi beberapa halaman atau page merupakan suatu kebutuhan untuk blog Anda maka silahkan untuk memakai cara ini.
Berbeda dengan arahan yang dipakai untuk membagi halaman posting menjadi beberapa bagian, arahan script ini memakai native JavaScript dan tidak perlu lagi memakai jQuery sehingga dengan memakai arahan script ini tidak akan besar lengan berkuasa kepada loading blog Anda.
Cara split artikel menjadi beberapa halaman di blogger ini sama ibarat memakai pagination yang artinya membagi beberapa halaman memakai nomor halaman. Hanya saja bedanya kalau ini membagi artikel atau postingan menjadi beberapa halaman.
Untuk pengguna wordpress mungkin Anda sanggup memakai beberapa plugin ibarat WP PageNavi, WP Paginate, WP Smart Pagination, dan masih banyak lagi plugin di wordpress untuk membagi halaman posting menjadi multiple page.
Perlu Anda ketahui bahwa arahan script ini juga hampir sama dengan split posting yang ada pada wordpress, dikala mengklik tombol angka halaman script ini akan meload halaman tersebut, hanya saja ini dipakai pada blogspot.
Cara Membagi Postingan Blog Menjadi Beberapa Halaman
Langsung saja bagi Anda yang ingin membagi postingan menjadi beberapa halaman di blog Anda, silahkan simak cara pemasang kodenya dibawah ini.Pasang Kode JavaScript dan CSS Untuk Membagi Postingan Blog
1. Masuk ke Blogger.com.2. Klik Tema > Edit HTML.
3. Cari arahan
</body>.4. Copy arahan j4vascript dibawah ini, kemudian Paste di atas arahan
</body>.<b:if cond='data:blog.pageType == "item"'> <b:if cond='data:blog.isMobile == "false"'> <script type='text/j4vascript'> //<![CDATA[ document.addEventListener('DOMContentLoaded', function() { function checkChildren(nodes, elemId){ for(i=0;i<nodes.length;i++){ if(nodes[i].id==elemId){ return nodes[i]; }else{ return checkChildren(nodes[i].children, elemId); } } } function isNumeric(value) { var type = typeof value; return (type === 'number' || type === 'string') && !Number.isNaN(value - Number.parseFloat(value)); } var nodes = document.querySelector('div.post-body').children; var splitdong = checkChildren(nodes, 'postsplit').innerHTML; var content = splitdong.split('<!--nextpage-->'); var url = window.location.href; var url = url.split('?'); var no = url[1] + '&m=4'; var no = no.split('m'); var no = no[0]; var no = no.replace('&', ''); var url = url[0]; var i = 1; if( !isNumeric(no) ){ var no = 1; } document.getElementById('postsplit').innerHTML = content[no-1]; if( content.length > 1 ) { document.getElementById('postsplit').innerHTML += "<div class='cm-pagenav cm-clearfix' id='post-pager'><span class='page current'>Page :</span> </div>"; } if( no>1 ){ document.getElementById('post-pager').innerHTML += "<a href='"+url+"?"+(no-1)+"' title='Previous Page'> Previous</a>"; } content.forEach(function(item) { if( no == i ){ document.getElementById('post-pager').innerHTML += "<span class='current'>"+i+"</span>"; } else { document.getElementById('post-pager').innerHTML += "<a href='"+url+"?"+i+"' rel='nofollow' title='Page "+i+"'>"+i+"</a>"; } i++; }); if(content.length > no){ var nn = parseInt(no) + 1; document.getElementById('post-pager').innerHTML += "<a href='"+url+"?"+nn+"' rel='nofollow' title='Next Page'>Next</a>"; } }); //]]> </script> </b:if> </b:if></style> atau ]]></b:skin>5. Copy arahan css dibawah ini, kemudian Paste diatas arahan
</style> atau ]]></b:skin>/* Page Navigation */ .cm-pagenav{text-align:center;line-height:1.4em;margin:15px 0 30px 0;text-align:center;font-size:14px}.cm-pagenav span,.cm-pagenav a{background-color:#4e92df;box-shadow:0px 6px #4886ca;-moz-box-shadow:0px 6px #4886ca;-webkit-box-shadow:0px 6px #4886ca;-moz-transition:none;-webkit-transition:none;transition:none;display:inline-block;padding:10px 15px;margin-left:3px;margin-right:3px;vertical-align:middle;font-size:14px;color:#fff !important;text-decoration:none !important}.cm-pagenav .pages{background:#4e92df;color:#fff}.cm-pagenav .current,.cm-pagenav a:hover{top:4px;position:relative;box-shadow:0px 2px #4886ca;-moz-box-shadow:0px 2px #4886ca;-webkit-box-shadow:0px 2px #4886ca}.cm-pagenav a:active{top:6px;position:relative;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}.cm-pagenav .pages{display:none}.cm-clearfix{clear:both}Catatan:
Kode script diatas mungkin tidak akan bekerja disemua template, perhatihan bahwa script diatas berfungsi kalau pada bab post di template Anda memakai arahan
<div class='post-body'>.Perhatikan arahan berikut:
var nodes = document.querySelector('div.post-body').children;div.post-body dengan arahan post yang ada pada template blog Anda. Contohnya:<div class='post-body'> memakai div.post-body><div class='post'> memakai div.post<div id='post-body'> memakai div#post-body<div id='post'> memakai div#postCara Membagi Postingan Menjadi Beberapa Halaman
2. Pastikan Anda berada pada bagain HTML bukan Compose.
3. Tambahkan arahan
<div id="postsplit"> diawal goresan pena dan tambahkan arahan </div> diakhir tulisan.4. Untuk membagi postingan, gunakan arahan
<!--nextpage-->.5. Setelah selesai klik Perbarui artikel.
Source code by Gianmr
Itulah artikel mengenai cara membagi postingan blog menjadi beberapa halaman, kalau Anda mempunyai saran maupun pertanyaan silahkan hubungi kami melalui halaman kontak atau dengan memperlihatkan komentar dibawah ini. Sumber http://www.caramanual.com