Percantik tampilan Blog pager pada postingan Blog

Percantik tampilan Blog pager pada postingan Blog

Percantik tampilan Blog pager pada postingan Blog
percantik tampilan newer/older post blog
Percantik tampilan Blog pager pada postingan Blog - Untuk mengisi waktu luang Osa malam ini, sekaligus untuk membuat catatan juga agar tidak perlu mencari-carinya lagi di rumah si mbah.

Blog pager post memiliki artian next dan prev pada blog. Dan Osa akan membuat memo untuk Osa sendiri (siapa tau bisa bermanfaat juga buat kalian), mengenai mempercantik tampilan Blog pager di postingan.

Di beberapa template yang beredar, biasanya tampilannya standart atau bahkan tidak ditampilkan (seperti pada template blog Osa ini). Sebelumnya Blog pager di blog Osa di hidden oleh mas Basri Matindas.

Tampilan tersebut Osa ambil dari template mbak Arlina dengan mengubah kode warnanya saja. Menyesuaikan dengan template yang sedang Osa gunakan.

Copy kode dibawah ini dan pastekan diatas </b:skin> atau </style>
#blog-pager a.blog-pager-newer-link:hover,
#blog-pager a.blog-pager-older-link:hover{background:#30bead;color:#fff;opacity:1}#blog-pager a.home-link{background:#30bead;margin:7px 0;padding:8px 12px;line-height:normal;color:#fff;font-weight:400;font-size:13px;text-transform:uppercase;display:inline-block;overflow:hidden;text-align:center;list-style:none;border-radius:4px;opacity:.7}
#blog-pager a.home-link:hover{background:#30bead;color:#fff;opacity:1}
#blog-pager .blog-pager-older-link{float:right}
#blog-pager .blog-pager-newer-link{float:left}
#blog-pager .blog-pager-older-link span{margin-right:10px}
#blog-pager .blog-pager-newer-link span{margin-left:10px}
#blog-pager{text-align:center;padding:10px 0;overflow:hidden;border-bottom:1px solid rgba(0,0,0,0.05);border-top:1px solid rgba(0,0,0,0.05)}

Sobat ganti kode warna #30bead sesuai keinginan sobat. Jika sudah, save template dan lihat hasilnya. Demonya bisa sobat lihat diakhir postingan Osa. Paling bawah diatas footer. Hehehe.

Wassalam.

0 komentar untuk Percantik tampilan Blog pager pada postingan Blog

Tuliskan yang ingin Anda cari dan tekan Enter untuk Mencari