.JPG)
Diposkan oleh Label: Tips dan Trik Bloggerdi 19.25
Pada Postingan Ini saya akan membagikan sebuah tips menarik yaitu membuat kotak admin dibawah postingan dengan animasi terbaru caranya gampang sekali jika saudara ingin mencobanya silahkan ikuti langkah dibawah ini.....
Masuk blog saudara
pilih template/edit html
kemudian cari kode ]]></b:skin> gunakan ctrl + f untuk mempermudah anda
jika sudah ketemu copas kode dibawah ini tepat diatas tag ]]></b:skin>
#sigilabox { margin: 10px auto; background: #aaa; padding: 5px; float: left; border: 1px solid #333; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; text-shadow: 1px 1px 1px #000; -o-transition: all 2s ease-in; -moz-transition: all 2s ease-in; -webkit-transition: all 2s ease-in; } #sigilabox:hover { box-shadow: -2px -2px 1px #555, 2px 2px 1px #555, 0 -0 15px #000; -moz-box-shadow: -2px -2px 1px #555, 2px 2px 1px #555, 0 -0 15px #000; -webkit-box-shadow: -2px -2px 1px #555, 2px 2px 1px #555, 0 -0 15px #000; } #sigilabox h3 { font-size: 18px; font-weight: bold; color: #FF0000; margin: 0; } .sigila { height: 100px; overflow: auto; margin : 10px 0 10px 0; padding :10px; box-shadow : -1px -1px 1px #000, 3px 3px 4px #444, 1px 1px 8px #000; -moz-box-shadow : -1px -1px 1px #000, 3px 3px 4px #444, 1px 1px 8px #000; -webkit-box-shadow : -1px -1px 1px #000, 3px 3px 4px #444, 1px 1px 8px #000; border-radius: 10px; -moz-border-radius:10px; -webkit-border-radius:10px; background : #eee; background: -moz-linear-gradient(top, #aaa, #eee); background: -webkit-gradient(linear, left top, left bottom, from(#aaa), to(#eee)); font-size: 14px; font-family: Arial; font-weight: normal; color: #000000; text-shadow: 1px 1px 1px #eee; } .sigila a { font-weight: bold; font-family: Times; color: #8B0000; text-shadow: 1px 1px 1px #000; text-decoration: none; } .sigila a:hover { color: #8B0000; } .sigila img { float: left; width: 90px; border: 3px solid #fff; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; padding: 2px; background: #ddd; opacity: 0.5; margin: 0 10px 2px 0; -o-transition: all 2s ease-in; -moz-transition: all 2s ease-in; -webkit-transition: all 2s ease-in; } .sigila img:hover { opacity: 1.0; -o-transform: scale(1.2) rotate(-30deg); -moz-transform: scale(1.2) rotate(-30deg); -webkit-transform: scale(1.2) rotate(-30deg); }
Cari Lagi kode <data:post.body/> gunakan ctrl + f tentunya
jika sudah ketemu copas kode dibawah ini tepat dibawah tag <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div id="sigilabox">
<h3>Happy Blogging...</h3>
<div class='sigila'> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzcoOb3b7bAM1Drc_D-RiG87rviFNa1OhaeM9AU2doHeHjZD1UvruKHZkbz-NbvlbO-EW4G7i1kd9n7Y_copzFx-BpGXKEWCYa37DJ0SsV6v_RRaRlRldXLiXHegroWXrHkf_x5wSRu2LS/s320/jokowi.jpg
" title="Imron fhatoni"/>Ini Hanyalah Blog Sederhana yang membagi Informasi Seputar Dunia Blogging,Sebelumnya terima kasih atas kunjungan baik anda di blog ini dan Saya Berharap Saudara tidak keberatan untuk menyalurkan kritik dan saran saudara pada kotak komentar mengenai blog ini<br /><a href="http://informasibloger.blogspot.com/" target="_blank" title="Informasi Seputar Dunia Blogger">http://informasibloger.blogspot.com</a></div></div>
</b:if>
Catatan : Silahkan ganti kode berwarna merah dengan URL gambar sobat sendiri
kode <data:post.body/> biasanya lebih dari satu nah untuk mempermudah anda silahkan dicoba satu persatu tetapi biasanya penempatan yang tepat adalah dibawah kode <data:post.body/> yang nomor 2
atau juga yang nomor 3 silahkan disesuaikan saja gan dengan template yang saudara pakai....
Langkah terakhir simpan template anda kemudian lihat hasilnya.....
selamat mencoba semoga bermanfaat......
Penulis : Imron fhatoni Lokasi : NTB, SUMBAWA
Artikel Menambahkan Kotak Admin Dibawah Postingan Dengan Animasi Baru, ditulis oleh Imron fhatoni. Semoga artikel ini dapat menambah wawasan Kita. 
Silahkan tinggalkan jejak pada form Komentar untuk mempermudah Imron fhatoni berkunjung kembali ke blog sobat. 
0 komentar:
Posting Komentar