Cara Membuat Kotak Iklan 300x250 Dan 125x125 Di Blogger




Cara Membuat Kotak Iklan 300x250 Dan 125x125  Di Blogger

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.

Share Google URL Shortener: Get Short URLloading short url

Bila Anda merasa memang artikel-artikel di blog ini bisa bermanfaat, maka Anda bisa membantu memberikan donasi melalui Paypal Dana hasil dari donasi akan digunakan untuk memperpanjang domain mizipedia.com - Terima kasih.

Comment Policy Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Peraturan Berkomentar di mizipediacom
1. Berkomentarlah dengan Relevan dan Sopan
2. Jangan Spam
3. Tidak Porn dan Sara
4. Berkomentar dengan link tanpa relevan maka akan otomatis terhapus
5. Semua komentar pasti akan saya baca dan dibalas. Show Emoticon. Klik ==>

+ Follow
Join on this site

with Google Friend Connect