Home » Blogger Hack » Cara Mengedit Bullet List Dengan Gambar di Blogger

Cara Mengedit Bullet List Dengan Gambar di Blogger

Kali ini Blog Gado Gado akan menampilkan artikel berjudul Cara Mengedit Bullet List Dengan Gambar di Blogger. Dengan artikel Cara Mengedit Bullet List Dengan Gambar di Blogger ini kami berharap dapat menjadi sebuah rujukan dan bahan penambah wawasan kita terkait dengan judul tersebut. Artikel ini adalah hasil pencarian di google dengan kata kunci Cara Mengedit Bullet List Dengan Gambar di Blogger kemudian saya kumpulkan dan saya sajikan buat anda di Blog Gado Gado ini. Semoga kehadiran artikel ini bermanfaat bagi kita semua.anda juga dapat melihat artikel sebelumnya atau artikel berikutnya. Ok, langsung saja berikut adalah artikel Cara Mengedit Bullet List Dengan Gambar di Blogger selengkapnya:

D-Copy Blog's | Saya baru-baru berbagi tutorial untuk menyesuaikan tampilan Anda daftar peluru dan daftar nomor   dan hari ini kita akan belajar bagaimana mengubah daftar peluru menggunakan efek gambar Hover. Arahkan kursor di atas daftar peluru di bawah ini untuk melihat efeknya.
Animasi-Bullet-Daftar
Langkah :

  1. Bukan akun Blogger Anda.
  2. Masuk ke Menu Template > Edit HTML > Proceed > centang Expand Template Widget
  3. Cari kode dibawah ini :
]]></b:skin>
     4.  Pastekan kode dibawah ini diatas pada kode diatas :
.post ul {list-style:none;
}
.post ul li {
    line-height: 1.4em;
        background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgep1GHW6FtGNs04CfmvTpIrIddSK6-1y6d_Ty7GZ4LXuBMDgI6glRg-onzUQrF8kkntwdtbE7QDa1iQN5EB99q7yVKB-UXQyqJ1GSP565S-PxJWXn2tcNiKZdKhZSHhv2FrXDmXLzdJxg/s400/265.gif) no-repeat scroll 0px 4px;
    margin: 0.3em 0;
    padding: 0 0 0.8em 20px;
}
.post ul li:hover {
        background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8P3i_zdtDcXjQiCThEPhXcrACApBNkRDQn0tsQL7gDDAiTUKfTI6Hg2sNYhtb6x3ArUSTrSY3LL0nwEiZ3DDcNBHPb9bMDv7ppJCKvOECYH5LODDo2Il-ODjPQ8VfEP6Y9cxM0oxWOck/s400/261.gif) no-repeat scroll 0px 4px;
     5.  Simpan template Anda dan Anda selesai!

Kustomisasi

  • Ganti kode yang diwarnai dengan URL gambar pilihan Anda.

Anda juga bisa menggunakan pengeditan HTML postingan jika Anda hanya ingin membuat di salah satu postingan tertentu saja, kodenya ada dibawah ini :
<style>
ul {list-style:none;
}
ul li {
    line-height: 1.4em;
        background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgep1GHW6FtGNs04CfmvTpIrIddSK6-1y6d_Ty7GZ4LXuBMDgI6glRg-onzUQrF8kkntwdtbE7QDa1iQN5EB99q7yVKB-UXQyqJ1GSP565S-PxJWXn2tcNiKZdKhZSHhv2FrXDmXLzdJxg/s400/265.gif) no-repeat scroll 0px 4px;
    margin: 0.3em 0;
    padding: 0 0 0.8em 20px;
}
ul li:hover {
        background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8P3i_zdtDcXjQiCThEPhXcrACApBNkRDQn0tsQL7gDDAiTUKfTI6Hg2sNYhtb6x3ArUSTrSY3LL0nwEiZ3DDcNBHPb9bMDv7ppJCKvOECYH5LODDo2Il-ODjPQ8VfEP6Y9cxM0oxWOck/s400/261.gif) no-repeat scroll 0px 4px;
}
</style>
<ul>
<li>Ini adalah Sample Text</li>
<li>Ini adalah Sample Text</li>
<li>Ini adalah Sample Text</li>
</ul>

Nah, sobat Blog Gado Gado.. Anda telah membaca seluruh artikel berjudul Cara Mengedit Bullet List Dengan Gambar di Blogger dengan keword yang masuk Blogger Hack . Anda dapat memberikan komentar ditempat yang telah tersedia. Terima kasih kunjungan Anda.

0 komentar:

Posting Komentar