Tips Tutorial Cara Menciptakan Kotak Iklan Adsense Di Samping Judul Blog

Kotak iklan atau space iklan di samping judul blog mempunyai tingkat keterlihatan yang sangat tinggi, baik pada perangkat desktop maupun seluler. Dengan kondisi ibarat itu, tentunya ruang iklan pada header blog mempunyai nilai proposal yang jauh lebih besar daripada space iklan lainnya di Blog.

Ada dua cara membagi Header Blogspot menjadi dua bagian. Cara pertama memakai model persen yang tutorialnya sudah pernah aku bagikan dengan judul Cara menciptakan space iklan pada header Blogspat. Dan untuk cara yang kedua yakni dengan memberi nilai niscaya pada lebar salah satu bab header blog.

Namun, kalau kalian ingin menciptakan kotak iklan disamping judul blog untuk memasang iklan Adsense, sebaiknya gunakan model kedua.

Berikut cara menciptakan kotak iklan disamping judul blog, versi kedua.

1. Cari instruksi HTML yang ibarat mirip di bawah ini.

<b:section class='header' id='header' maxwidgets='1' name='Header' showaddelement='no'> <b:widget id='Header1' locked='true' title=' (Header)' type='Header' version='1'>⋯</b:widget> </b:section>

2. Salin instruksi berikut, lalu letakkan sempurna di atas instruksi pertama.

<div class='columns'> <div class='column-center-outer'> <div class='column-center-inner'>

3. Salin instruksi berikut, lalu letakkan sempurna di bawah instruksi pertama.

</div> </div> <div class='column-right-outer'> <div class='column-right-inner'> <b:section class='header' id='header-2' maxwidgets='1' name='Header-Ads' showaddelement='yes'/> </div> </div> <div style='clear: both;'/> </div>

4. Letakkan instruksi CSS berikut di atas instruksi </head>

<style type='text/css'>   .header-outer{overflow: hidden; margin: 0 0 20px;}   .header-inner .columns{padding-left: 0!important; padding-right: 728px!important;}   .header-inner .column-right-outer{width: 728px!important; margin-right: -728px!important;}   .header-inner .Header .titlewrapper, .header-inner .column-right-outer{padding: 10px 0 0;}   .Header h1, .Header .description{text-align: center!important;}   .Header h1{font-size: 30px;}   .Header .description{font-size: 10px}   @media screen and (max-width:970px){     .header-inner .columns{padding-left: 0!important; padding-right: 0!important;}     .header-inner .column-right-outer{width: 100%!important; margin-right: 0!important; padding: 0!important;}     .Header h1{font-size: 50px;}     .Header .description{font-size: 15px;}   } </style>

5. Simpan Tema / Template

Baca juga:

1. Cara memindahkan Unit iklan main_Blog1 kedalam artikel.
2. Tips biar permohonan Adsense cepat diterima sepenuhnya
3. Daftar template default Blogger responsive & cocok untuk daftar Adsense

Catatan:

1. Meskipun posisi header-ads pada tata letak tidak saling bersebelahan dengan judul blog, namun hal itu tidak mensugesti tampilan aslinya.
2. Jika Anda telah menyembunyikan widget CSS Bundle, copot sementara kodenya. Setelah iklan terpasang, silahkan pasang lagi kodenya.
3. Untuk header blog dengan background gelap, biasanya butuh waktu sedikit lebih usang untuk iklan dapat tayang.