- Siapkan Icon Social Network dapat di ambil di ICONARCHIVE
- Login ke blogger
- Template > Edit HTML
- Cari Kode </header> (gunakan CTR+F biar gampang)
- Masukkan kode dibawah ini tepat di bawah kode </header>
<div class='button-widget'><a class='postlink' href='LINK DITUJU-1' target='_blank'><img alt='' border='0' src='URL GAMBAR/ICON-1.JPG'/></a>
<a class='postlink' href='LINK DITUJU-2' target='_blank'><img alt='' border='0' src='URL GAMBAR/ICON-2.JPG'/></a>
<a class='postlink' href='LINK DITUJU-3' target='_blank'><img alt='' border='0' src='URL GAMBAR/ICON-3.JPG'/></a>
</div>
- Cari Kode
.header-inner .Header .descriptionwrapper {
padding: 0 $(header.padding);
}
- Masukkan kode dibawah ini tepat di atas kode .header-inner .Header .descriptionwrapper {
padding: 0 $(header.padding);
} tadi.
.button-widget {float:right;border:0;margin-right:465px;margin-top:-258px;height:60px;width:308px;}.button-widget a img {border:none;}.button-widget a:hover img {border:none;opacity:0.9;filter:alpha(opacity=80);-moz-opacity:0.90;-khtml-opacity:0.9;}
- Setelah itu coba Klik Tombol "Preview" dan liat hasilnya. Kalau Posisi tidak sesuai Keinginan, Kreasikan Sendiri ya. danBerikut Keterangannya :float:right; = Posisi float gambar tersebut right=kanan dan left=kiri , sesuaikan sesuka Kalian.margin-right:465px; = Atur posisi kesamping/kanan icon dengan mengganti ukuran pixel tersebut. lakukan sambil di preview untuk hasil yg cepat dan memuaskan. Misalnya Perubahan dari 465px ke 365px, Jika sudah di ganti maka di Preview ya :)margin-top:-258px; = Atur posisi keatas icon dengan mengganti ukuran pixel tersebut.. lakukan sambil di preview untuk hasil yg cepat dan memuaskan.Misalnya Perubahan dari -258px ke -365px, Jika sudah di ganti maka di Preview ya :)height:60px; = Atur tinggi icon yang kamu pasangwidth:308px; = Atur lebar icon yang kamu pasang (semakin banyak icon seharusnya semakin besar ukuran pixel)opacity:0.9;filter:alpha(opacity=80);-moz-opacity:0.90;-khtml-opacity:0.9;Kode diatas yg berwarna Kuning ke Orange-Orange-an adalah bagian hover. Jika Kalian ingin tampilan seperti bena maka tambah kan bagian opacity menjadi 1.0.jika dirasa sudah memuaskan klik Simpan.
Sekian, Wassalamualaikum.
terima kasih ilmunya....
ReplyDeletesama-sama
ReplyDelete