Home » » Cara Membuat Tombol Navigasi Untuk Blogger

Cara Membuat Tombol Navigasi Untuk Blogger

Written By Unknown on Tuesday, January 14, 2014 | 9:31 AM

Assalamualaikum warahmatullahi wabarakatu..
Selamat datang sobat Trexter dan apa kabarnya nih..? :)
Hari ini saya akan membuat posting mengenai cara membuat tombol navigasi untuk blogger. Tapi sebelumnya sobat TheCookies udah tau gak apa sih sebenarnya tombol navigasi untuk blog itu?

Oke, tombol navigasi yang ada di blog itu fungsinya untuk memindahkan halaman blog ke halaman sebelumnya atau selanjutnya yang akan menampilkan posting-poting lain yang tidak mungkin akan muat jika ditampilkan hanya dalam satu halaman. Tombol navigasi ini akan memudahkan para pengunjung untuk melihat-lihat isi blog.

Baiklah.. Langsung saja, berikut ini caranya..
Cekidot..

  • Buka blogger.
  • Buka tata letak blog kamu.
  • Tambah gadget dan pilih HTML/Javascript.
  • Copy paste kode dibawah ini :

<style>#blog-pager{clear:both;margin:20px 0 20px;font-size: 12px;padding:10px 0;}#blog-pager-newer-link{float: left;}#blog-pager-older-link{float: right;}.Profile img{border:3px solid;float:left;margin:5px 10px 5px 0;padding:2;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}.profile-data{color:#999999;font:bold 20px/1.6em Arial,Helvetica,Tahoma,sans-serif;font-variant:small-caps;margin:0;text-transform:capitalize;}.profile-datablock{margin:0.5em 0;}.profile-textblock{line-height:1.6em;margin:0.5em 0;}a.profile-link{clear:both;display:block;font:80% monospace;padding:10px 0;text-align:center;text-transform:capitalize;}h2.date-header, .PageList h2{display:none;}#blog-pager-older-link a,#blog-pager-newer-link a,a.home-link,.showpageNum a,.showpage a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMsyAww-g619XYQw6VM4qww3PBl2ImAYmceOkS-CDzm8rNOwpi3DbG1x_FXE9rEcCBCPRS31zlgK2WZF4kWSexYLh1nenpT7by5o0F9B9GGMctqT3LiTPVSTIpSxhicOIcrg9gYRBjhfk/s1600/nav.jpg) repeat-x;border:1px solid #ae4402;color:#fff;margin:2px;padding:6px 10px 5px;text-decoration:none;text-shadow: 1px 0 1px #000;}#blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,a.home-link:hover,.showpageOf,.showpagePoint,.showpageNum a:hover,.showpage a:hover{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3T6fMcgWqRf4gu_Ot1uY2cz7flpAqrHSgpNrYkPigW2HsKsGpEMGqegYPIdeLri6qGuJ_OhT88dov15gvsIma8oIEx4gwAwV_lK6SdROQx8-XK_ntT5G5f9s92QQ4ancJujrVYYxkKqU/s1600/nava.jpg) repeat-x;border:1px solid #000000;color:#fff;margin:2px;padding:6px 10px 5px;text-shadow: 1px 0 1px #000;}</style><script type='text/javascript'>var postperpage=10;var numshowpage=5;var upPageWord="Prev.";var downPageWord="Next";var urlactivepage=location.href;var home_page="/"</script><script src='http://code.helperblogger.com/hb-page-navi.js' type='text/javascript'></script>
Keterangan :

  1. Ganti 10 dengan jumlah posting yang akan ditampilkan dalam satu halaman.
  2. Ganti 5 dengan banyaknya tombol navigasi.
  3. Ganti Prev. dengan teks yang akan menunjukkan tombol sebelumnya
  4. Ganti Next dengan teks yang akan menunjukkan tombol selanjutnya.

  • Selanjutnya klik Simpan/save.
  • Seret gadget yang telah dibuat tadi kebawah gadget posting.
  • Setelah itu klik simpan setelan.
Atau untuk cara yang lebih mudah silahkan gunakan Page Navigation Widget dari Helper Blogger.
Widget Navigation
Nah.. Mungkin cuma itu.. Sobat Trexter, jangan lupa yah tinggalkan komentar kalau ada pertanyaan, tanggapan, kritikan, ataupun saran seputar blog ini. Berikan pula +1 ataupun Like nya. Terima kasih dan sampai jumpa..

Share this article :

0 comments:

Post a Comment

|[ PENGIKUT ]|



 
Support : Blog | Wonogiri Streaming | Web
Copyright © 2013. Wonogiri Cyber Team™ - All Rights Reserved
Template Created by Creating Website Modified by Dodhy Irawan
Proudly powered by Blogger