Latest News
Saturday, September 22, 2012

Cara Buat Page Navigation Pada Blog

Berikut adalah cara untuk membuat Page Navigation pada Blog. Apa itu page navigation yang di maksudkan? page navigation atau navigasi adalah satu widget atau lebih tepat adalah Javascript bagi memudahkan anda beralih dari page depan blog ke page blog yang kedua ataupun boleh jump page ke page mana yang anda inginkan. Script ini adalah bagi menggantikan Link "Olderst.. Home Newerst.." pada kaki di setiap blog. Bagi anda yang tidak menggunakan simbol atau icon boleh cuba cara seperti di bawah..
Contoh Page Navigation di gunakan di Silenblogz

Anda masih lagi boleh mencuba cara Page Navigation ini kerana dengan cara ini blog anda akan kelihatan agak profesional (citarasa masing-masing) berbanding dekorasi menggunakan icon ataupun membiarkan tanpa menggunakan apa-apa widget. Berdasarkan testimonial didapati loding blog akan menjadi lebih cepat berbanding menggunakan icon atau image. Ramai yang menggunakan image atau icon sebagai page navigation sedangkan kurang di antara kita mengambil berat tentang saiz gambar tersebut. Apa yang kita sering pratikkan cuma mengubah kelebaran dan ketinggian sahaja.

Berikut adalah cara buat Page Navigation Pada Blog :

  1. Login Dashboard
  2. Edit html
  3. Expand Widget Templates [#]
  4. Sila tekan Ctrl + F (serentak) atau cari kod ini :
     
    ]]></b:skin>
Apabila dah jumpa kod ini : ]]></b:skin>

Langkah Pertama :
- Sila gantikan (replaced) kod tersebut dengan kod di bawah :

.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  border:1px solid #999;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  background: #ddd;
  }

.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
  border:1px solid #888;
  background: #ccc;
  }

.showpagePoint {
  color:#fff;
  text-shadow:0 1px 2px #333;
  padding: 3px 8px;
  margin: 2px;
  font-weight: 700;
  -webkit-border-radius:3px;-moz-border-radius:3px;
  border:1px solid #999;
  background: #666;
  text-decoration: none;
  }

]]></b:skin>

Seterusnya Sila tekan Ctrl + F (serentak) atau cari kod ini : </body>
Apabila dah jumpa kod ini : </body>

Langkah Kedua :
- Sila gantikan (replaced) kod tersebut dengan kod di bawah :

&lt;script type='text/javascript'&gt;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
&lt;/script&gt;
&lt;script src='silence-blogz.googlecode.com/files/pagenavigation.js' type='text/javascript'&gt;&lt;/script&gt;
</body>



Sila tukarkan mengikut setting blog anda :
var postperpage=7;
var numshowpage=4;

Postperpage = Berapa jumlah Entry yg anda set di muka depan blog.
numshowpage = Berapa banyak nombor yg nak di paparkan di blog (disyorkan jangan di ubah)

Kemudian preview dulu untuk lihat hasilnya.. kalau berpuas hati sila simpan..

INCOMING SEARCH TERM :

Cara Buat Page Navigation Pada Blog, Tutorial Buat Page Navigation Pada Blog
  • Blogger Comments
  • Facebook Comments

5 comments:

  1. biasanya page vagigation ni sesuai utk blog jenis camna ye?

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. dashboard baru skrg ni susah plak nk bukak html..isk

    ReplyDelete
  4. blog sy xde (previous page, home ngan next page) mcmana nak buat kasi ade yek? coz dh cuba buh page navigation ni, buat punya buat tak timbul2.. hurm..

    ReplyDelete
  5. @azstory ada sedikit kesilapan mmg x menjadi.. klu ikut langkah di atas pasti menjadi...

    lihat langkah ke 2 tu... awk cari ni : /body> kemudia gantikan dia dgn kod yg saya bagi... ingat GANTIKAN BUKAN PASTE DI ATAS

    ReplyDelete

Sebarang Komen yang tidak berkaitan dengan artikel / SPAM akan Di PADAM. Terima Kasih.

Item Reviewed: Cara Buat Page Navigation Pada Blog Rating: 5 Reviewed By: potia casadelarossa