Memasang Unlimited Page Navigation untuk Blogger

adscblog

Cara Memasang atau Membuat Unlimited Page Navigation di blog,Page Navigation atau halaman tak terbatas ini sangat cocok untuk blog karena tidak membatas seberapa banyak halaman postingan yang kita buat di blog

Dengan adanya Unlimited Page Navigation dengan angka ini selain memudahkan Para Blogger juga memudahkan Para Pengujung untuk terus menelusuri semua artikel atau sebagian artikel yang mereka cari di blog kita

Oleh Karena itu adanya Unlimited Page Navigation ini sangat membantu sekali,nah kali ini saya akan mencoba memberikan Trik cara membuat Page Navigation dengan tidak terbatas atau Unlimited yang biasa nya Unlimited Page Navigation ini anda jumpai di Template Simplify,ya seperti itulah kira kira

Untuk Sobat yang ingin mencoba memasang Unlimited Page Navigation di blog,silahkan sobat blog untuk mengikuti langkah langkah cara memasang Unlimited Page Navigation tersebut di bawah ini

• Silahkan SObat Masuk ke akun Blogger SObat
• Lalu kemudian silahkan klik blog milik sobat
• Lalu kemudian Klik Tema > Edit Html
• Setelah berada di pengeditan Html silahkan sobat masukan CSS berikut sebelum kode </head>

Untuk Pemasangan Warna Gelap Unlimited Page Navigation

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<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>

Untuk Membuat Warna Gelap Unlimited Page Navigation

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<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>

• Lalu Langkah selanjut nya silahkan sobat cari lagi kode </body> lalu letakan kode berikut sebelum kode tersebut

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<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>

• langkah selanjutnya lalu sobat cari lagi kode seperti berikut

 <!-- navigation -->
    <b:include name='nextprev'/>

dan ganti dengan kode berikut

<!-- navigation -->
    <b:if cond='data:blog.pageType == &quot;index&quot;'>
        <b:include name='nextprev'/>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;archive&quot;'>
        <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>

• Kemudian Save Template dan lihat hasil nya

Nah itulah cara membuat Unlimited Page Navigation di blog,semoga artikel ini dapat membantu sobat blogger semua dan selamat mencoba

adscblog

Recommendation Apps

ads1

Previous

Posting Lebih Baru

Next

Posting Lama

Posted by Dede Ubed, Published at 17 Agustus and have 0 komentar