Cara Membuat Kotak Iklan 300x250 Dan 125x125 Di Blogger Cara Membuat Kotak Iklan 300x250 Dan 125x125 Di Blogger - mizipediacom mizipediacom: Cara Membuat Kotak Iklan 300x250 Dan 125x125 Di Blogger

KATEGORI










LIVE TV

Iklan Semua Halaman

Cara Membuat Kotak Iklan 300x250 Dan 125x125 Di Blogger

Sunday, 15 April 2018




Pada malam ini saya akan berbagi Cara Membuat Kotak Iklan 300x250 Dan 125x125  Di BloggerMungkin sudah banyak teman-teman yang membuat artikel judul seperti di atas, namun saya rasa tidak ada salahnya untuk saya share kembali kan. Dan tentu kita sudah tahu bukan jika sidebar di blog bukan hanya digunakan untuk kepentingan penunjang konten blog, Tetapi sidebar tersebut juga dapat kita gunakan untuk ruang iklan mandiri yang biasanya menampilkan banner iklan 300x250 atau juga banner iklan 125x125. 

Dengan kita memasang kotak iklan tersebut menjadi suatu alternative monitize blog selain dari iklan Adsense mapun iklan yang lainnya. Artinya barang kali anda ingin membuka jasa pemasangan iklan pada blog anda, mungkin artikel ini cocok untuk anda terapkan di blog anda.

Keberadaan banner iklan 300x250 dan iklan 125x125 ini harus kita tata dengan rapih agar tampilannya tidak merusak pemandangan blog kita. Seperti yang anda lihat apalagi jika space iklan belum terisi banner iklan yang di tuju, maka tampilannya harus rapih agar orang mengetahui bahwa kita menyediakan slot iklan banner 300x250 dan iklan banner 125x125.


Dengan membuat kotak iklan 300x250 dan 125x125 di blog dengan CSS dan HTML yang sederhana yang membuat tampilannya rapih dan memberikan informasi yang jelas kepada orang lain yang sedang mengakses blog milik kita bahwa pada sidebar blog kita menyediakan pemasangan slot iklan banner.

Dan kotak iklan banner 300x250 dan 125x125 tentu pastinya akan menambah penghasilan dari blog. Apalagi jika blog anda pengunjung perharinya mencapai 1-5 ribu pengunjung. Nah untuk harga tiap slot iklan banner ini tentu saja bisa ditentukan oleh kita sendiri sebagai pemilik blog tersebut, untuk masalah harga mungkin tidak sama pastinya, akan terdapat perbedaan harga slot banner iklan antara jasa website kita dan jasa orang lain.

Banner iklan yang belum terisi maka slot akan menampilkan text yang menjelaskan bahwa slot tersebut tersedia untuk iklan banner, baik iklan banner 300x250 dan maupun iklan banner iklan 125x125.

Jika anda memang tertarik untuk mencobanya, bisa anda ikuti langkah-langkah di bawah ini, Nah untuk demo lihat saja gambar video GIF di atas yang sudah saya sediakan.

Cara Membuat Kotak Iklan 300x250 Dan 125x125

  1. Pertama , pastikan anda sudah masuk di dasbhor anda sendiri
  2. Kemudian masuk pada bagian editor template , caranya pilih Menu Template -> Edit HTML.
  3. Copas kode di bawah ini dan letakan di atas kode ]]></b:skin> untuk Blog AMP silahkan tambahkan style amp-custom.
    *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
    .kotak_iklan{background:#efefef;width:300px;margin:0 auto;text-align:center;padding:16.6666666667px}
    .kotak{background:grey;height:125px;width:125px;display:inline;margin:0;padding:0;float:left;position:relative;}
    .kotak:nth-child(1),.kotak:nth-child(3){margin-right:16.6666666667px}
    .kotak:nth-child(1),.kotak:nth-child(2){margin-bottom:16.6666666667px}
    .kotak a{position:relative;display:block;z-index:2}
    .kotak:before{content:"Your Space 125x125";line-height:1.2;position:absolute;top:0;left:0;width:100%;height:100%;color:#fff;font-size:20px;display:flex;flex-direction:column;justify-content:center;z-index:1;}
    .kotak-300{width:300px;height:250px;}
    .kotak.kotak-300:nth-child(1){margin-right:0;margin-bottom:0;}
    .kotak_iklan.p0{padding:0;}
    .kotak-300:before{content:"Your Space 300x250";}
    .clear{clear:both;}
  4. Selanjutnya anda simpan kode di bawah ini di dalam HTML berikut pada widget HTML/JavaScript di sidebar.
    <div class="kotak_iklan p0">
        <div class="kotak kotak-300">
        <!-- simpan banner 300x250 di bawah ini -->
       
        </div>
        <div class="clear"></div>
    </div>
    <br />
    <div class="kotak_iklan">
        <div class="kotak">
        <!-- simpan banner 125x125 di bawah ini seperti contoh berikut ini -->
        <a href="#" target="_blank" rel="nofollow noopener" title="Bitcoin">
        <img src="file:///C:/Users/tarmizi/Downloads/mizipediacom.webp" alt="Bitcoin" title="Bitcoin" height="125" width="125"/>
        </a>
        </div>
       
        <div class="kotak">
        <!-- simpan banner 125x125 di bawah ini -->
       
        </div>
       
        <div class="kotak">
        <!-- simpan banner 125x125 di bawah ini -->
       
        </div>
       
        <div class="kotak">
        <!-- simpan banner 125x125 di bawah ini -->
       
        </div>
       
        <div class="clear"></div>
    </div>
  5. Jika sudah selesai tinggal anda klik save Template.
Dan tinggal anda simpan banner-banner iklan pada slot-slot tersebut sesuai keterangannya dan seperti contoh yang saya berikan di atas. seperti ini: <a href="#" target="_blank" rel="nofollow noopener" title="Bitcoin"> <img src="file:///C:/Users/tarmizi/Downloads/mizipediacom.webp" alt="Bitcoin" title="Bitcoin" height="125" width="125"/> </a>
Demikian penjelasan saya pada malam ini semoga bermanfaat untuk anda, selamat mencoba dan sukses kawan.
Baca Juga