Cara Membuat Background Pada Judul Widget Di Blog

Cara Membuat Background Pada Judul Widget Di Blog
Cara Membuat Background Pada Judul Widget Di Blog. Siapa yang belum tahu maksud saya membuat postingan ini? Ya, pada dasarnya jika kita membuat suatu template ataupun struktur dari sebuah blog, biasanya widget-widget akan tampil sesuai dengan apa yang sudah diaplikasikan oleh pembuat templatenya, namunn pihak Blogger juga memberikan layanan edit html yang mebuat para blogger bisa memodifikasi tampilan blog keseluruhan, fungsi itu akan kita gunakan pada kesempatan kali ini, tepatnya pada tutorial tentang cara membuat background atau latar belakang pada judul widget.

Bisa dilihat pada gambar diatas, jadi nantinya judul widget yang kita berikan latar belakang atau background ini akan memiliki "alas", entah itu dalam bentuk warna polos, gradient, maupun gambar, semua itu dapat kita atur dengan menggunakan kode CSS. Jika anda menggunakan template-template dari pihak ke-3, biasanya mungkin pada judul-judul widget anda sudah diberikan latarbelakang, untuk menerapkan kode CSS dibawah ini, maka anda perlu menghapusnya terlebih dahulu, agar tidak "bentrok" kodenya.

Cara Membuat Background Pada Judul Widget Di Blog

1. Login Ke Blogger.

2. Masuk Ke Dashboard.

3. Pilih Template.

4. Klik "Edit HTML".

5. Cari kode ]]></b:skin> (gunakan CTRL+F), lalu letakkan kode dibawah ini tepat diatasnya.

  • Background dengan gambar

.sidebar h2 {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgU1K5sYUAbjtvlABIwR7Qd29loW3dtjXYJl_hnUuBh19Evb38QNxAQIwSHCJ5fiN_ahwVai6iVlN8v0g70M7DbSIpEWqZOPxECP9GrgEBBcMjYZoWrBlXUy0-tcYulTp1pJkdWfLcLf8E/s144/buton.jpg)repeat-x;
color: #071019;
font-size: 12px;
font-family: Arial;
font-weight: strong;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align:center;
}

Keterangan: Ganti kode yang berwarna merah dengan URL Gambar background widget.

  • Background dengan warna

.sidebar h2 {
background:#696969;
color: #071019;
font-size: 12px;
font-family: Arial;
font-weight: strong;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align:center;
}

Keterangan: Ganti kode yang berwarna merah dengan Kode dari warna background widget.

6. Klik "Save/Simpan Template", dan selesai.

Semoga bermanfaat, dan selamat mencoba. Demikian informasi terbaru seputar tutorial dan tips trik blogging tentang Cara Membuat Background Pada Judul Widget Di Blog

    Share this

    Related Posts

    Previous
    Next Post »