Cara Modifikasi Label Blogspot Dengan Gambar

Label Blogspot

Bismillah... tutorial blog pada kesempatan ini saya akan membahas sedikit cara merubah tampilan label pada blogspot. setelah kemarin saya posting tetang cara merubah kolom label menjadi 2, sekarang saya akan share cara menyispkan gambar pada label.

Baca Juga

• Harga dan Spesifikasi Android Xiaomi Mi5
• Harga dan Spesifikasi Android Advan Vanbook W100
• Template Login Page Hotspot PSB
• Kumpulan DP Malam Minggu Bergerak
• Teknologi Tanam Mina Padi Pada Tanah Persawahan
• Pemandangan Indah Gua Melissani Yunani
• Sinkronisasi Waktu Otomatis di Routerboard
• Download Vektor Template Maulid
• Template Voucher Hotspot Mikrotik Gradasi
• Template Voucher Mikrotik Versi cdr (Corel Draw)
• Login Page Mikrotik Dengan Kode Voucher Only
• Template Login Page Hotspot Bulan Ramadan
• Cara Menyisipkan Formulir Google Doc di Blog
• Cara Mudah Menghilangkan Navbar Di Blogger
• Download PhotoRed Blogger Template
• Cara Membuat Handscroll Image Di Blog
• Beberapa Situs Penyedia CSS3 Generator
• Membuat Diamond Dengan CSS3
• Tri Angle Label Cloud Blogspot
• CSS3 Gradient Generator Online

Secara Default label pada blogspot tidak memakai awalan gambar/background terus bagaimana caranya? caraa merubahnya gampang, sobat tinggal menyisipkan sedikit secript CSS pada blogspot.

• Langkah pertama Login ke Blogger
• Next Step masuk ke area Edit HTML yang berada di tab Design Blog
• Centang Expands Widgets
• Terus Sobat cari Tag ]]></b:skin>
• Setelah Ketemu sobat sisipkan kode CSS di bawah ini tepat di atas tag ]]></b:skin>

Kode CSS Tag Label

.Label .widget-content ul li { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZhizxHyBatZYXBaGeE8y8T8Dv3hnpYMgveC_trgstk2ms2cOuJfDirKRfut_Xry4O_2vO1X3JhS4pwUlV98GtuEEzzeu6ULMkIzirMU-fCoTz4iNko-c02MU3xVNHMNjP6aqGGw9DF20/s368/tag.gif') no-repeat 0 2px; padding: 0 0 3px 20px; }   

Setelah selesai save dan lihat hasilnya. dan jangan lupa tampilan label blog sobat memakai Display List jangan memakau Display Cloud. 

CSS Label Blogspot

• .Label : adalah tag label yang akan di modifikasi
• .widget-content : adalah conten yang terdapat pada widget blog
• background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZhizxHyBatZYXBaGeE8y8T8Dv3hnpYMgveC_trgstk2ms2cOuJfDirKRfut_Xry4O_2vO1X3JhS4pwUlV98GtuEEzzeu6ULMkIzirMU-fCoTz4iNko-c02MU3xVNHMNjP6aqGGw9DF20/s368/tag.gif : adalah alamat/URL gambar yang menjadi bakcgroun label.
• no-repeat 0 2px : background tidak di ulang ulang dan berada pada psosis 2 px dari sebelah kiri.
• padding: 0 0 3px 20px; : adalah jarak sepasi dari konten label

Di cukupkan sampai disini tutorial blog cara modifikasi label pada widget conten blogspot. semoga berhasil Good Luck Happy Bloging.