Cara Memasang Icon Di Samping Judul Sidebar Blog

Salah satu tips dan trik untuk mempercantik penampilan blog ialah dengan menambahkan icon pada judul sidebar. Hal ini sebenarnya dilakukan oleh para blogger karena tampilan standar yang diberikan oleh blogger kurang memuaskan.

Jadi bagi sobat yang ingin menambahkan icon di samping judul sidebar pada blognya ikuti langkah-langkah berikut ini.

1. Login ke blogger atau klik disini»
2. Pilih Template » Edit Html » Lanjutkan.
3. Jangan lupa centang Expand Template Widget.
4. Cari code yang mirip seperti di bawah ini dan fokuskan pencarian pada code yang berwarna merah.

h2 {
margin : 0 0 10px;
border-bottom : 2px dotted #ccc;
font-family:arial, serif;
font-size : 19px;
color : #000;

}

4. Hapus code yang berwarna biru dan ganti dengan code berwarna biru ini

h2 {
background:url(http://icons.iconarchive.com/icons/dakirby309/windows-8-metro/32/Folders-OS-Android-Metro-icon.png) left no-repeat;
margin : 0 0 10px;
padding:0 0 0 25px;
border-bottom : 2px dotted #ccc;
font-family : Arial, Helvetica, sans-serif;
font-size : 15px;
color : #000;

}

Catatan:

  • Ganti tulisan yang berwarna ungu dengan URL icon sobat.

5. Simpan/save template. Maka hasilnya akan nampak seperti gambar di bawah ini.

Cara Memasang Icon Di Samping Judul Sidebar Blog

Semoga tutorial kali ini bermanfat dan jangan lupa untuk meninggalkan komentar walupun hanya sekedar :) demi kemajuan blog ini. Happy Blogging…!!!

2 komentar:

Catatan:
Untuk menyisipkan video, gunakan tag <i rel="youtube">URL YOUTUBE ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA...</i>
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA...</i>
Untuk menyisipkan kode panjang, gunakan tag <i rel="pre">KODE ANDA...</i>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA...</strong>

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!"

Jika ingin menuliskan komentar yang keluar dari topik pada artikel ini silahkan kehalaman OOT (out of topic) dengan menekan tombol OOT di bawah ini.

Konversi Kode di Sini!OOT

 
Design by Juned al~Bughisy Copyright © 2012 ~ 2013 Powered by Blogger
Back to Top