Go Blog Go

Cool Page Button

Posted by Go Blog Go Posted on 7:20 PM with No comments
Assalamu'alaikum Wr.Wb.

Sua kembali Mojang dan Bujang dengan Go Blog Go, share posting kali ini membahas Cool Page ButtonPage Button (Tombol Halaman) yang berada paling bawah posting biasa-nya bertuliskan new-page / home / old-page, Saya memang membuat tombol ini hampir sama dengan Cool Readmore
Button , mulai saja :
  • Login ke Blogspot pakai Akun Mojang dan Bujang sendiri
  • Setelah masuk Dashboard -> Klik Monitize -> Pilih Template -> Klik Edit HTML -> Klik Prosess / Lanjutkan
  • Jangan lupa di Klik -> Expand Widget Templates 
Cari kode CSS di-bawah ini, yang merupakan kunci tombol halaman
#blog-pager-newer-link {float:end;} #blog-pager-older-link {float:right;} #blog-pager {text-align:center;}
Mojang dan Bujang tinggal ganti Kode CSS diatas dengan kode CSS dibawah ini :
#blog-pager{line-height:20px!important}
#blog-pager-older-link a,#blog-pager-newer-link a,#blog-pager a.home-link {display:inline-block; position:relative;margin:10px;padding:7px 10px;-webkit-border-radius:18px; -moz-border-radius:18px;border-radius:18px;font:13px "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;background-color:#0483a0;background-image:-webkit-gradient(linear,left top,left bottom,from(#0483a0),to(#31b2c3))!important; background-image:-webkit-linear-gradient(top,#0483a0,#31b2c3)!important; background-image:-moz-linear-gradient(top,#0483a0,#31b2c3)!important; background-image:-ms-linear-gradient(top,#0483a0,#31b2c3)!important; background-image:-o-linear-gradient(top,#0483a0,#31b2c3)!important; color:#cbfbfe!important; box-shadow:inset 0 1px 1px #fff,0 3px 3px rgba(0,0,0,0.6); border:1px solid #00748f!important; font-weight:600;text-shadow:0 -1px 0 rgba(0,0,0,0.3)
} #blog-pager-older-link a:hover,#blog-pager-newer-link a:hover,#blog-pager a.home-link:hover {box-shadow:inset 0 2px 6px #fff,0 3px 3px rgba(0,0,0,0.6)} #blog-pager-older-link a:active,#blog-pager-newer-link a:active,#blog-pager a.home-link:active {color:#fff; box-shadow:inset 0 2px 6px #fff,0 1px 1px rgba(0,0,0,0.6);top:2px; -webkit-box-shadow:0 1px 5px #0483a0,0 1px 15px #0483a0,0 1px 25px#0483a0;-moz-box-shadow:0 1px 5px #0483a0,0 1px 10px #0483a0,0 1px 25px #0483a0; box-shadow:0 1px 5px #0483a0,0 1px 10px#0483a0,0 1px 25px #0483a0;}
Sedangkan untuk Demo-nya Mojang dan Bujang bisa lihat dibawah postingan WebBlog punya Saya ini.
Save Template Mojang dan Bujang jangan lupa !!!


Untuk yang berminat memasang-nya silahkan Download Aja Script CSS-nya

Download

Eng ... Ing ... Eng dah jadi deh Button Cool Page-nya, Selamat berkreasi !!! Go Blog Go...!!! Amiin

Wassalam,

0 comments:

Post a Comment

Catatan :
1.Untuk menyisipkan Kode, gunakan Tag <i rel="code">Kode Anda Di-Sini...</i>
2.Untuk menyisipkan Kode Panjang, gunakan Tag <i rel="pre">Kode Anda Di-Sini...</i>
3.Untuk menyisipkan Kode Gambar, gunakan Tag <i rel="image">URL Gambar Anda Di-Sini...</i>
4.Untuk menyisipkan Catatan, gunakan Tag <b rel="quote">Catatan Anda Di-Sini...</i>

NB: Sebelum menyisipkan Kode, konversi terlebih dulu Kode-nya agar bisa tampil di Kolom Komentar

 
Powered by : Blogger
Copyright © 2011. Go Blog Go - All Rights Reserved
Template Created by Go Blog Go Published by Wong Wayang