|
|
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 Ala Utta */
#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/AVvXsEj9VsrgEizcnw_sT50etvP6OJBH3ih87GtQBNCSYpnGoz-DjPmTVMXswEr_oETh9Hzr6WOVX6hJwF21USp94U15MUY6rNQnvVhcapns7gPkmjf5-aYBxnwPPMpMFNuLdK7vMhX0pdjiPolC/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/AVvXsEhIv4a_rvK8vBb46yYzNF7k3GaaKBRrMRymnniAOy_9JORk-3Uwt2mB8w2ihr651G7A7xGAASgU2nBNK6gxBezXlLWDIYt_kY6dumj3a-2D0DdriUJoTiPzsA1aAxmHcWwPJWijiT51izNl/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. ^^
Silahkan anda laporkan jika ada link yang rusak atau beberapa tutorial yang tidak bekerja, karena saya akan segera memperbaikinya, dan berhubung saya baru mengganti themes blog, jadi pasti banyak artikel yang berantakan!
Saya harap anda dapat membantu saya untuk memperbaiki semuanya dengan berkomentar di artikel yang bermasalah..
thanks sebelumnya sudah berkunjung keblog utta yang sederhana ini...
Please rate this article:
{[['
', '
']]}
', '']]}{["Useless", "Boring", "Need more details", "Perfect"]}
Jika Artikel ini menarik, Silahkan copy paste permalink berikut ini di blog sobat!
sangat bermanfat, numpang sedot yac......
BalasHapusgua numpang copas ya bang,,makasih nih,,!!
BalasHapus@Surya☼Chandra☼Gobel slhkan gan, asl cntumkan link sumber'Nya :b
BalasHapus