Follo Molo (Become My Stalker And Ask Me To Stalk Back....I prefer a Yandere...)

Bored?You can play around with these line of colours for a while.....it is 100times better than PS4...because I dont have one....

14 Ogos 2010

Blog Tutorial:Page Navigation


 Contoh Page Navigation Yang Ada Kat Bawah Blog Ni





Camna nak buat:(Backup Dulu Template Sblm Mula)

LANGKAH#1:

Log in kedalam Blogger,pergi ke Layout -> Edit HTML

Lepas tu cari kod:
</body>

Dan sebelum/kat atas kod </body>,pastekan kod ni:

<!--PAGINATION-MULA-->
<script type='text/javascript'>
var pageCount=10;
var displayPageNum=3;
var upPageWord =&#39;Sblm&#39;;
var downPageWord =&#39;Strsnya&#39;;
</script>
<script src='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/pagination1.js' type='text/javascript'/>
<script src='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/pagination2.js' type='text/javascript'/>
<!--PAGINATION-TAMAT-->

Nota Tapak Kaki:
var pageCount=10;bilangan pos yang dipamer

var displayPageNum=3;nombor butang yang dipamer

Contoh: Sblm 3 4 5 6 7 8 9 Strsnya

LANGKAH#2

Langkah kedua pula adalah untuk menggayakan page navigation kita

Cari kod </head>

Dan sebelum/kat atas kod </head>,pastekan kod ni:


<!--PAGINATION-MULA-->
<link href='http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/pagination2.css' rel='stylesheet' type='text/css'/>
<style type='text/css'>
.showpage a:hover {
color: #FFFFFF;
background-color: #92416C;
}
// STYLE CODE UNTUK LAMAN PILIHAN
.showpagePoint {
color: #FFFFFF;
background: #92416C;
border: 1px solid #92416C;
}
// STYLE CODE UNTUK BUTANG MULA
.showpageNum a:link,.showpage a:link {
color: #000000 !important;
background-color: #92416C;
border: 1px solid #92416C;
}
// HOVER CODE untuk Butang Nombor
.showpageNum a:hover {
color: #FFFFFF !important;
background: #92416C !important;
border: 1px solid #92416C;
}
// STYLE CODE untuk Butang Mula Sblm dan Slps
.showpageArea a {
border: 1px solid #92416C;
}
// HOVER CODE untuk Butang Sblm dan Slps
.showpageArea a:hover {
border: 1px solid #92416C;
color: #FFFFFF !important;
background: #92416C !important;
}
</style>
<!--PAGINATION-TAMAT-->

Save template,dah siap.

2 ulasan

@Siti Fatimah Mohamad cuba awak tulis alamat blog awak,nnti saya tngok knapa,awak cuba test tngok pakai browsr IE dulu sbb kekadang ada tmplate tak nmpk kat Mozila tapi ada plak kat IE

Reply

Hmm,apa kata awak cuba sekali lagi ikut arahan yang diberi,saya dah perbaiki sikit entri ni(ada kslahn teknikal),rasanya kali ni msti jadi,Dah jadi jgn lupa komen :D

Reply

Nota: Hanya ahli blog ini sahaja yang boleh mencatat ulasan.

At the post page,this banner can be spin around ;)