Inilah Cara Mudah Membuat Kotak Gadget/Iklan Disamping Header
Inilah Cara Mudah Membuat Kotak Gadget/Iklan Disamping Header - Halo sobat, kali ini saya mau berbagi artikel yang mungkin bisa bermanfaat bagi sobat semua yakni cara membuat kotak widget/iklan disebelah header. ada berbagai cara untuk membuatnya dan saya punya tutorial yang sangat mudah untuk sobat semua coba.
Fungsi dari adanya kotak widget disebelah header/judul blog biasanya untuk menampulkan iklan.
Langsung saja kita praktik sekarang. Beikut tutorialnya :
Fungsi dari adanya kotak widget disebelah header/judul blog biasanya untuk menampulkan iklan.
Langsung saja kita praktik sekarang. Beikut tutorialnya :
- Login ke Blogger sobat, kemudian ke menu Template
- Setelah itu, pilih Edit HTML dan carilah kode .header-outer { dengan ctrl+f, ini lengkapnya
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;
}
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;
}
- Kemudian ganti dengan kode dibawah ini
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;_background-image: none;min-height: 104px;}
#header {
width: 40%;
margin-right: 10px;float: left; }
#headerkanan {
float: right;
width: 54%;
margin: 20px 10px 5px 10px;
padding: 2px;}
#headerkanan .widget {margin: 3px;}
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;_background-image: none;min-height: 104px;}
#header {
width: 40%;
margin-right: 10px;float: left; }
#headerkanan {
float: right;
width: 54%;
margin: 20px 10px 5px 10px;
padding: 2px;}
#headerkanan .widget {margin: 3px;}
Keterangan :
.header-outer { pada bagian height: 104px(untuk mengatur tinggi header).#header { pada bagian width: 40%; lebar header kiri.#headerkanan { pada bagian width: 54%; lebar header kanan. dan margin: 20px 10px 5px 10px; posisi atas-bawah header kanan.
- Berikutnya, cari kode <div class='region-inner header-inner'> dan tambahkanlah kode dibawah ini disebelah kanannya
<b:section class='headerkanan' id='headerkanan' maxwidgets='1' showaddelement='yes'></b:section>
- Sehingga kodenya akan menjadi seperti dibawah ini
<div class='region-inner header-inner'><b:section class='headerkanan' id='headerkanan' maxwidgets='1' showaddelement='yes'></b:section>
- Terakhir, Save Template.
No comments :
Post a Comment