Menambahkan Icon pada Link List / Label

red arrow
Sekarang kita akan mencoba menambahkan icon pada label dan link sidebar. Yang dimaksud dengan icon link list adalah icon kecil di samping daftar link yang biasa kita tempatkan pada sidebar blog kita. Icon ini bisa bermacam-macam. Pertama sekali anda harus sudah menyimpan icon pada image hosting anda. Misalnya di tiniypic.com, photobucket.com atau tempat tempat hosting gambar lainnya. Contohnya icon panah hijau dengan alamat penyimpanan seperti ini:

    http://i35.tinypic.com/2n03mgz.jpg

Nanti bisa anda ganti dengan icon milik anda. Seperti biasa login ke blogger dengan id anda. Cari kode berikut:

    .sidebar li {
    border-bottom:1px dotted #cccccc;
    margin:0;
    padding:0 0 .25em 17px;
    line-height:1.2em;
    }

Mungkin ada perbedaan pada template, fokus saja kode .sidebar li { yang merupakan kode pada daftar link di sidebar atau cari kode yang hampir mirip. Kemudian tambahkan alamat icon anda di bawahnya. Contohnya:

    .sidebar li {
    background:url("http://i35.tinypic.com/2n03mgz.jpg") no-repeat 0px .20em;
    border-bottom:1px dotted #cccccc;
    margin:0;
    padding:0 0 .25em 17px;
    line-height:1.2em;
    }

Lalu klik tombol Simpan Template dan lihat hasilnya. Jika tidak ada masalah, hasilnya akan seperti gambar di bawah ini :

Link List / Label

Di sebelah kiri daftar link dan label akan ada icon panah kecil. Oke selamat menambahkan icon pada label dan link sidebar, mudah-mudahan berhasil ya...

Sumber: bangdel.blogspot.com

17 komentar:

  1. makasih atas infonya
    mohon koreksi di blog aku ya

    BalasHapus
  2. kayanyablog q dah ada sob bawaan dr template

    BalasHapus
  3. kalo untuk PPC gimana mas..mohon pencerahannya

    BalasHapus
  4. ada bawaan dari template.,. gk bisa di blogku.,

    BalasHapus
  5. @ ryuuza: Malah lebih mudah mas, tinggal cari gambarnya terus diganti dengan gambar yang baru.

    BalasHapus
  6. mantap gan salam kenal ,,,semoga sukses selalu amiin

    BalasHapus
  7. infonya mantap banget mas Bos.. :c: matur suwun

    BalasHapus
  8. mas gimana caranya kalau bikin menu vertical???????

    BalasHapus
  9. Thanks mas bro...sangat membantu neh

    BalasHapus
  10. Alhamdulillah....
    Hasilnya sangat bagus dan Tutorial ini sangat bermamfaat buat saya...

    BalasHapus
  11. manteb tenan pokoke semakin menarik saja jadinnya blog saya

    BalasHapus
  12. 7a replica bags wholesale from this source w0d63t6f32 replica bags in dubai my explanation z3h39h5n53 Louis Vuitton replica Bags replica bags aaa replica bags and watches navigate to this web-site v7t41h7a54 replica bags from china free shipping

    BalasHapus

Mau tukeran link? silakan buka Link Sahabat dan apabila ada pertanyaan silakan tulis di Kotak Pertanyaan. Terima Kasih...

Kami akan menghapus komentar yang: Tak sopan, memakai HURUF BESAR, berupa caci maki, mengandung kata-kata kebun binatang, debat kusir, provokasi, di luar konteks, berupa undangan/ reklame. Komentar yang terlalu panjang, tanpa paragraf dan sulit dipahami. Komentar copy-paste, silakan di-link saja.

Isi komentar adalah tanggung jawab penulis komentar, bukan tanggung jawab pengelola blog/situs ini. Harap maklum.