Cara Membuat Autoload Page Navigation on Scroll
JejakSeru.com - Kali ini saya akan membuat tutorial tentang Autoload Page Navigation, dengan script ini maka postingan kamu akan load otomatis ketika halaman di scroll ke bawah. Script ini akan memudahkan untuk pengunjung melihat postingan lama beriktunya dan tidak perlu loading lagi untuk menuju ke index posting lama.
Untuk kamu yang tertarik memasangnya pada blog kamu silahkan ikuti tutorial di bawah ini:
Langkah 1 : Masuk ke Blogger > Template > Edit HTML > lalu tambahkan script di bawah ini di atas kode
Langkah 2 : Cari kode
Langkah 3 : Simpan template
Jika dirasa bermanfaat silahkan share/bagikan ke temen-temen terdekat kamu dan jangan lupa like fanspage facebook kami dan follow twitter kami agar selalu dapat informasi bermanfaat dari kami.
Untuk kamu yang tertarik memasangnya pada blog kamu silahkan ikuti tutorial di bawah ini:
Langkah 1 : Masuk ke Blogger > Template > Edit HTML > lalu tambahkan script di bawah ini di atas kode
</body>
<b:if cond='data:blog.pageType == "index"'>
<script src='https://cdn.rawgit.com/JejakSeru/RianiDesign/bb655461/autoloadpost.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery.ias({
container : '.blog-posts',
item: '.post-outer',
pagination: '#blog-pager',
next: '#blog-pager-older-link a',
loader: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj07ogQGrpgv16mRHE-NkO9u9RW3_ENP8JibykqQZ8OU0NF5lfaqmHGizahzX2GLkeQjr5WqfdwRK0tHmUUDLHTGuW9-H8SB1rulmyWFJXDkNzZlk_aYxG2HW4O2keO0u14VJ31hDkrfwI/s1600/rianidesignloader.gif'
});
</script>
</b:if>
Langkah 2 : Cari kode
<b:includable id='nextprev'>...</b:includable> Lalu ganti dengan kode di bawah :
<b:includable id='nextprev'>
<b:if cond='data:blog.pageType != "item" and data:blog.pageType != "static_page"'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'/>
</span>
</b:if>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'/>
</span>
</b:if>
<div class='mobile-link-button' id='blog-pager-home-link'>
<a class='home-link' expr:href='data:blog.homepageUrl' expr:title='data:homeMsg'/>
</div>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
</b:if>
<div class='clear'/>
</b:includable>
Langkah 3 : Simpan template
Jika dirasa bermanfaat silahkan share/bagikan ke temen-temen terdekat kamu dan jangan lupa like fanspage facebook kami dan follow twitter kami agar selalu dapat informasi bermanfaat dari kami.
Setiap template memiliki script page navigation yang berbeda, hapus script page number navigation yang ada di template kamu agar script autoload ini bisa berjalan dengan baik.