Bagi anda yang suka dengan Postingan Pada Homepage berwarna Ala Kang Ismet , saya akan memberikan tutorialnya , cara mudah kok gak begitu ribet , kita tinggal menambahkan css gambar pada pembungkus Thumbnail auto readmore dan menandai postingan berdasarkan label . untuk demonya bisa lihat home page blog saya ( bila masih dipakai ) atau gambar dibawah ini
WWW.RHM-FILES.TK |
Cara Mudah Membuat Postingan Berwarna Ala Kang Ismet
2. Jika sudah memasang auto readmore tanpa java script diatas , kemudian temukan kode .thumbnail-post di editor template anda
3. Ganti kode .thumbnail-post dengan kode dibawah ini ( bila anda tidak menggunakan auto readmore dengan cara diatas tadi , mungkin kode pembungkus gambarnya berbeda , silahkan sesuaikan dengan id pembungkus gambar auto readmore )
.thumbnail-post{background:#2c3e50;position:absolute;top:0;left:0;transition:all 0.15s 0s ease-in-out;float:left;margin:0;padding:0;width:230px;height:160px;display:block;overflow:hidden;border-radius:4px} .thumbnail-post:before{content:'';position:absolute;top:75px;right:0;border-width:10px 10px 10px 0;border-style:solid solid solid none;border-color:transparent #fff transparent} .thumbnail-post img{width:125px;height:125px;padding:0;margin:10px 50px;border-radius:100px;border:rgba(255,255,255,0.2) solid 5px;border-radius:100px} .thumbnail-post img:hover{border:rgba(255,255,255,0.6) solid 5px}
- Supaya Auto readmorenya berwarna warni , silahkan pasang java script ini diatas kode </body>
<script type='text/javascript'> //<[![CDATA[ function get_random_color() { var letters = '0123456789ABCDEF'.split(''); var color = '#'; for (var i = 0; i < 6; i++) { color += letters[Math.round(Math.random() * 14)]; } return color; } $(function () { $(".thumbnail-post").each(function () { $(this).css("background", get_random_color()); }); }); //]]> </script>
- Kemudian yang terkahir Klik Save Template
Taraa .. !!! Gimana brow udah berhasil belom menerapkan postingan home page warna-warni seperti di blognya kang ismet ? hehhehe , juka auto readmore anda udah berwana-warni bearti anda sudah bisa menerapkanya , bila masih bingung silahkan komen aja brow
0 Komentar untuk "Tips Membuat Postingan Warna-Warni Seperti Blog Kang Ismet "
Don't forget leave some comment