Cara Memasang Navigasi Halaman Unlimited Pada Blog
Pada halaman depan blog pada cuilan bawahnya biasanya akan terdapat goresan pena "older post", yang jikalau di klik akan mengarahkan Anda kehalaman postingan sebelumnya yang lain pada blog tersebut. Halaman awal di blog hanya akan menampilkan postingan terbaru.
Page navigaion ini berfungsi untuk mempermudah pengunjung blog untuk melihat postingan Artikel yang lain yang tidak ada pada halaman depan.
Unlimited page navigation atau navigasi halaman tak terbatas ini sangat baik untuk blog, sebab tidak membatasi jumlah postingan yang ada di blog Anda. Postingan ini aku share ulang dari arlina design. Sengaja aku posting juga di blog aku sebab aku juga ingin mempelajarinya dan menyimpannya sebagai cadangan jikalau ingin mengedit template nanntinya.
1. Login Ke Blogger > Theme > Edit Template. Salin Kode berikut ini sebelum aba-aba </head>
Untuk warna gelap
2. Selanjutnya silahkan copy dan pastekan aba-aba Script berikut sebelum </body>
3. Selanjutnya, cari aba-aba di bawah ini
<b:includable id='main' var='top'>
Lalu scroll kebawah hingga Anda temukan Kode dibawah ini
<!-- navigation -->
<b:include name='nextprev'/>
Silahkan lihat balasannya di disini
Demikian tutorial kali ini wacana cara memasang Unlimited page navigation atau navigasi halaman tak terbatas pada blog. terimakasih
sumber : https://bloglandai.blogspot.com/search?q=memasang-unlimited-page-navigation-di-blogger Sumber https://dewaplokis.blogspot.com/
Page navigaion ini berfungsi untuk mempermudah pengunjung blog untuk melihat postingan Artikel yang lain yang tidak ada pada halaman depan.
1. Login Ke Blogger > Theme > Edit Template. Salin Kode berikut ini sebelum aba-aba </head>
Untuk warna gelap
<b:if cond='data:blog.pageType != "item"'> <b:if cond='data:blog.pageType != "static_page"'> <style type='text/css'> /* Page Navigation */ #blog-pager{background:#2d3141;clear:both;width:auto;padding:22px;line-height:normal;position:relative;display:block;text-align:left;overflow:visible;margin:20px 0 5px 0} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{background:rgba(255,255,255,.1);display:inline-block;font-size:13px;color:rgba(255,255,255,.8);padding:5px 10px;margin:0 2px 0 0;border-radius:2px;transition:all .3s} .showpage a:hover,.showpageNum a:hover,.showpagePoint:hover{background:rgba(0,0,0,0.2);color:#fff;position:relative;} .showpagePoint{background:#70c3eb;color:#fff;z-index:200;position:relative;} @media screen and (max-width:640px) { #blog-pager {padding:12px;} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{margin:0 2px 2px 0}} @media screen and (max-width:320px) { .showpage a,.showpageNum a,.showpagePoint,.showpageOf{padding:3px 6px}} </style> </b:if> </b:if><b:if cond='data:blog.pageType != "item"'> <b:if cond='data:blog.pageType != "static_page"'> <style type='text/css'> /* Page Navigation */ #blog-pager{background:#fff;clear:both;width:auto;padding:22px;line-height:normal;position:relative;display:block;text-align:left;overflow:visible;margin:20px 0 5px 0} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{position:relative;background:#fff;display:inline-block;font-size:13px;color:rgba(0,0,0,.8);padding:5px 8px;margin:0 4px 0 0;box-shadow:0 1px 4px 1px rgba(0,0,0,0.1);border-radius:2px;transition:all .3s} .showpageNum a:before{content:'';position:absolute;top:0;bottom:0;left:0;right:0;box-shadow:inset 0 -2px 2px rgba(0,0,0,0.02);transition:box-shadow 0.5s} .showpage a:hover,.showpageNum a:hover,.showpagePoint:hover{background:rgba(0,0,0,0.03);color:#333;position:relative;} .showpagePoint{background:#2980b9;color:#fff;} @media screen and (max-width:640px) { #blog-pager {padding:12px;} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{margin:0 2px 2px 0;box-shadow:0 1px 2px 1px rgba(0,0,0,0.1);}} @media screen and (max-width:320px) { .showpage a,.showpageNum a,.showpagePoint,.showpageOf{padding:3px 6px}} </style> </b:if> </b:if>Silahkan pilih salah satu jenis cssnya dan mengedit isi cssnya (gelap / terang) sesuai dengan pilihan Anda. Untuk ini, aku memakai warna gelap
2. Selanjutnya silahkan copy dan pastekan aba-aba Script berikut sebelum </body>
<b:if cond='data:blog.pageType == "index"'> <script type='text/javascript'> /*<![CDATA[*/ var postperpage=7;var numshowpage=3;var upPageWord ='Prev';var downPageWord ='Next';var urlactivepage=location.href;var home_page="/"; /*]]>*/ </script> <script src='https://cdn.rawgit.com/rachma92/tipsterkini/master/unlipage.js' type='text/javascript'/> </b:if>Silahkan Anda Ganti aba-aba postperpage=7 dengan jumlah artikel yang akan ditampilkan Pada setiap halaman Blog Anda dan ganti angka 3 pada aba-aba numshowpage=3 menjadi jumlah nomor yang ditampilkan di Page Navigation ini
3. Selanjutnya, cari aba-aba di bawah ini
<b:includable id='main' var='top'>
Lalu scroll kebawah hingga Anda temukan Kode dibawah ini
<!-- navigation -->
<b:include name='nextprev'/>
Kemungkinan lokasinya berbeda dari tiap template, jadi silahkan cari saja letaknya pada template Anda.Jika sudah ditemukan silahkan salin dan paste aba-aba dibawah ini
<!-- navigation --> <b:if cond='data:blog.pageType == "index"'> <b:include name='nextprev'/> <b:else/> <b:if cond='data:blog.pageType == "archive"'> <b:include name='nextprev'/> <b:else/> <b:if cond='data:blog.homepageUrl != data:blog.url'> <!-- navigation --> <b:include name='nextprev'/> </b:if> </b:if> </b:if>Silahkan lihat balasannya di disini
Demikian tutorial kali ini wacana cara memasang Unlimited page navigation atau navigasi halaman tak terbatas pada blog. terimakasih
sumber : https://bloglandai.blogspot.com/search?q=memasang-unlimited-page-navigation-di-blogger Sumber https://dewaplokis.blogspot.com/