TipsTrick Tutorial Blog

Cara Membuat 4 Kotak Iklan 125×125 Di Blog

Cara Membuat 4 Kotak Iklan 125×125 Di Blog ~ Kali ini admin jagoankode akan sedikit berbagi untuk cara pembuatan space iklan kosong, maupun mengisi space iklan berupa gambar atau animasi text, Sudah sekitar beberapa hari ada yang meminta saya untuk membuatkan kotak widget berupa kotak iklan yang sering disebut juga kotak partner iklan sebanyak 4 kotak ataupun lebih di platform blogger, nah kali ini mungkin sekalian saya share aja untuk cara pembuatannya ya, kotak iklan berukuran kecil size ukuran 125 x 125 berfungsi untuk sebagai media promosi di blog kamu, seperti contoh kamu juga bisa meletakkan berupa partner blog berbentuk kerjasama ataupun yang lain.

Mungkin kebanyakan kalian yang memiliki trafic blog yang tinggi amat disayangkan kalau kalian tidak promosi sekalian, walau hanya berbentuk banner jika kalian membuat semenarik mungkin. pastinya di klik orang juga. oleh karena itu kalian wajib memasang ini untuk media promosi yang simple dan tidak memakan biaya apapun. Widget yang saya bagikan merupakan hasil redesign saya yang diambil dari beberapa sumber di internet. agar membuatnya semenarik mungkin, saya agak sedikit merubah tampilannya sedikit agar ringan dan tidak memberatkan blog kamu tentunya.

Dalam catatan penting yang saya perlu beri tahu kepada anda, image atau banner harus dibuat semenarik mungkin agar pengunjung tertarik dan membukanya, tetapi beberapa orang juga sampai membuat efek animasi berupa .gif agar terlihat menarik dan keren. Buat yang penasaran bagaimana cara membuat space iklan 4 kotak berukuran 125×125 saya akan memberikan sedikit penjelasan untuk pembuatannya, bagi yang belum melihat demonya, dapat anda lihat gambar dibawah ini :

Cara Membuat 4 Kotak Iklan 125x125 Di Blog

Sebagai Contoh saya memberi iklan space kosong, bisa juga di isi dengan gambar ataupun animasi, silahkan baca panduan dibawah ini :

Cara Membuat 4 Kotak Iklan 125×125 Di Blog

Unit iklan ini bisa anda kreasikan sendiri semenarik mungkin, saya akan memberikan 2 penjelasan untuk pembuatan iklan kosong seperti diatas, maupun berupa menambahkan gambar ke dalam kotak tersebut. kita akan coba praktekkan menambahkan cssnya dulu ke dalam thema atau template kamu.

1. Silahkan Login Ke Akun Blogger Kamu..
2. Pergi Ke Tema >> Edit HTML >> Tambahkan Kode Dibawah Ini Sebelum Tag ]]></b:skin>

.jagoankodeads{max-width:300px;margin:auto;text-align:center;display:block;background-color:#fff;font-family: 'Archivo Narrow', sans-serif;}.jagoankodeads img,.jagoankode img{display:block;padding:0;margin:auto;list-style:none}.jagoankode{width:125px;height:125px;margin:auto;text-align:center;color:#fff;font-size:80%;text-transform:uppercase;display:inline-block;text-align:center;padding:1px 1px 1px;}.jagoankode span{background-color:#204a84;width:100%;line-height:125px;display:table;margin:0 auto}


3. Simpan Tema.

Untuk Membuat Space IKLAN Kosong.

1. Silahkan Pergi Ke Tata Letak >> Tambahkan Gadget >> HTML/JAVASCRIPT.

2. Masukkan Kode/Script Berikut :

<div class="jagoankodeads">
<div class="jagoankode"><span>Advertise</span></div>
<div class="jagoankode"><span>Advertise</span></div>
<div class="jagoankode"><span>Advertise</span></div>
<div class="jagoankode"><span>Advertise</span></div>
</div>

3. Simpan Dan Lihat Hasilnya

Untuk Membuat Space IKLAN Yang Sudah Ada.

Jika Kamu Sudah Memiliki Iklan Berupa Gambar atau Animasi, Silahkan Ikuti Petunjuk dibawah.

1. Silahkan Pergi Ke Tata Letak >> Tambahkan Gadget >> HTML/JAVASCRIPT.

2. Masukkan Kode/Script Berikut :

<div class="jagoankodeads">
<div class="jagoankode"><a href="URL_IKLAN" title="Judul_Iklan" rel="nofollow noopener" target="_blank"><img src="URL_GAMBAR_IKLAN" /></a></div>
<div class="jagoankode"><a href="URL_IKLAN" title="Judul_Iklan" rel="nofollow noopener" target="_blank"><img src="URL_GAMBAR_IKLAN" /></a></div>
<div class="jagoankode"><a href="URL_IKLAN" title="Judul_Iklan" rel="nofollow noopener" target="_blank"><img src="URL_GAMBAR_IKLAN" /></a></div>
<div class="jagoankode"><a href="URL_IKLAN" title="Judul_Iklan" rel="nofollow noopener" target="_blank"><img src="URL_GAMBAR_IKLAN" /></a></div>
</div>

3. Simpan.

Note :
Sesuaikan Dengan Gambar Dan Url Yang Akan Dituju..

Kesimpulan…

Demikianlah artikel ini untuk cara pembuatan 4 kotak iklan baik itu space yang ada iklan, maupun membuat space kosong saja. kalian bisa memilih opsi diatas mana sesuai dengan kebutuhan yang kalian punya. baiklah alangkah baiknya saya tutup saja postingan kali ini. apabila masih ragu silahkan berkomentar dan terimakasih telah membaca.. nantikan update dari blog ini.

About the author

Kahfie IDN

Pengetahuan adalah kebebasan, dan ketidaktahuan adalah perbudakan.

Leave a Comment