Merubah Tulisan Older/Newer Post Dengan Float Image (Melayang)

Kali ini saya akan memberikan tips dan trik cara 'Merubah Tulisan Older/Newer Post Dengan Float Image (Melayang)', maksudnya disini kita akan merubahnya menjadi image (melayang),saya rasa sobat sklian sudah mengerti maksd sya dengan kata 'image melayang'. :D

Sering kita membaca artikel tentang cara merubah tulisan older post dan newer post dengan gambar. Tapi dalam artikel kali ini saya akan memberikan tutorial yang berbeda, dengan cara merubah tulisan older dan newer post dengan 'Float Image' Ala Utta.heheee..

baiklah jika masih bingung berikut screenshot gambarnya, dan contoh lainnya bs lht pda blog saya. 



Tertarik untuk membuatnya???
Berikut langkah - langkah nya.
1. Login ke Akun Blogger anda masing-masing
2. Klik Design atau Rancangan, kemudian pilih edit html
3. Centang Expand Widget Template (saya anjurkan download dahulu template anda)
4. Cari kode : ]]></b:skin>. Lalu Masukkan Kode CSS berikut tepat diatasnya.

/* Blog Pager  */
#blog-pager a{-webkit-transition:all .8s ease-out;-moz-transition:all .8s ease-out;-o-transition:all .8s ease-out;height:80px;opacity:0.6;overflow:hidden;position:fixed;text-indent:-9999px;top:44%;width:80px;z-index:9;margin:0 0 0 0px}
.blog-pager-older-link{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdE3mx0BWpF5wH4wKR0gaZwQDFY4ssbxm5uBGKVPNvKy0EwVAx35kFkYdPqbms_tSqy-dh-yVwYDhPGBIhGEKEG-3xpA3o2xU-L_8LZA0-fkWAG0SSOLiSjsAsYz9yyCpZi4hkex3KPJNH/s1600/next_button.png) no-repeat scroll 0 0 transparent;right:0px}
.blog-pager-newer-link{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpOedMcwT6yVWOvLSXweSFSBMHJXoZoG0Vqdl0dVFakYbr3dFFGxriSV4tZzYCOsneSq-intkpRO2Th6HdBkf50oKiDZbf8NSCtSdy-3Jk-7it2g99pj-Wnj_5XYHPqBpROqMttQiE82JV/s1600/prev_button.png) no-repeat scroll 0 0 transparent;left:0}
#blog-pager a:hover{opacity:0.9}

5. Save template, lalu lihat hasilnya,..

Semoga tutorial ini bermanfaat bagi anda. ^^