Cara Membuat Space Iklan Terbaru RESPONSIVE! di Blogger

RahmanCyber.NET | Blogger - Hai Sobat Blogger semua, yang baru bergabung ataupun yang udah veteran... Salam kenal semuanya... saya Pangeran Rahman dari kerajaan RahmanCyber.. hehe, Sudah lama tidak membahas tentang Blogger, kali ini Tutorial yang saya suguhkan adalah "Bagaimana Membuat Slot atau Space Iklan di Blog kita tercinta ini yaitu Blogger "   

 

{getToc} $title={Table of Contents}

 

slot iklan responsive blogger

 

 

Emang gunanya apa bang?

 

Gunanya ya kalo ada orang mau pasang iklan produknya di blog kita, sudah tau tempat mana yang kita sediakan... syukur syukur kita sudah menentukan harganya .. entah itu Perbulan, pertahun, atau Sekali Bayar..hehe

Ntar kita dapet uang dari penghasilan itu... lumayan kan misal kita mematok harga yang paling murah deh untuk iklan 300px an harga 50rb perbulan. Itu udah bisa nutup biaya sewa domain, kalo ada beberapa slot iklan.. coba deh bayangin sendiri, tinggal dikalikan aja, itu udah bisa jadi biaya buat kamu ngurus blog.

Jadi kamu ngurus blog itu udah ada bayarannya perbulan... hehe, tapiiiiii

It's not Easy man..!




Faktor yang Mempengaruhi Pertimbangan Pengiklan

 

 

Ada beberapa faktor dong yang mempengaruhi daya tarik pengiklan untuk iklanin produknya di blog kamu... hehe, apa Aja sih Faktor Daya Tarik Pengiklan agar mau ngiklanin produknya di blog kamu? 

 

1. Update

Ya, Diliat dulu dong, blognya updatenya seberapa kenceng... hehe, berapa hari sekali, atau berapa kali dalam seminggu.. biasanya si Pengiklan akan riset dulu tentang ini, sebelum memutuskan untuk akad iklan di blog kamu. 

 

2. Peringkatnya

Ya, jaman sekarang pengiklan juga udah canggih men, jadi sebelum ngiklan banyak pertimbangan.. agar bisa mendatangkan masukan yang bagus untuk kas perusahaannya. Jadi bisa aja pengiklan cek Peringkat di Alexa, atau melalui Check Domain Authority atau DA, atau juga bisa Page Authority atau PA. Kalo dulu Google Page Rank ya, tapi sekarang udah ganti PA dan DA 

 

3. Artikel

Biasanya ini menyangkut kesesuaian artikel dengan produk yang akan ia jual, apakah memang ada topik yang hampir hampir sesuai dengan produk yang dijual atau tidak. Kalau iya, itu bisa menambah penilaian dari pihak pengiklan 

 

4. Medsos

Media Sosial terkait seperti Facebook, twitter maupun medsos lain juga mempengaruhi, jika ada akan mendapat nilai plus di mata pengiklan 

 

5. Ramah atau Tidak

Ya ini juga jadi faktor nih gan, jadi untuk melayani pembeli dalam hal ini pengiklan, maka kita perlu ramah, setidaknya membiasakan diri menjadi pribadi yang ramah/




Itulah beberapa faktor yang mempengaruhi pertimbangan pengiklan, nah sekarang sekarang kita akan bahas nih, bagaimana cara membuatnya di blogger tampilan terbaru kita buat berukuran 300 x 250 dan 125 x 125 pixels yang letaknya berada di sidebar blog.




langsung aja berikut 

 

 

 

 

Tutorialnya Cara buat Slot Iklan Responsive di Blogger


1. Log in ke akun Blogger  – Tema  – Sesuaikan - Edit HTML.

 



*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.iklan_iklan{background:#efefef;width:300px;margin:0 auto;text-align:center;padding:16.6666666667px}
.iklan{background:grey;height:125px;width:125px;display:inline;margin:0;padding:0;float:left;position:relative;}
.iklan:nth-child(1),.iklan:nth-child(3){margin-right:16.6666666667px}
.iklan:nth-child(1),.iklan:nth-child(2){margin-bottom:16.6666666667px}
.iklan a{position:relative;display:block;z-index:2}
.iklan: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;}
.iklan-300{width:300px;height:250px;}
.iklan.iklan-300:nth-child(1){margin-right:0;margin-bottom:0;}
.iklan_iklan.p0{padding:0;}
.iklan-300:before{content:"Your Space 300x250";}
.clear{clear:both;}



2. Copy dan Pastekan kode Style CSS diatas ini tepat sebelum kode ]]></b:skin> atau </style> , Ini harus ekstra hati hatu, karena masih dakilam penyesuaian,

 

 



3. Simpan Tema Blogger kalian

4. Pilih menu Tata Letak / Layout  – Tambahkan Gadget  – Pilih HTML/JavaScript  – Masukan kode pemanggil di bawah ini.






Kode Iklan Universal Responsive



<div class="iklan_iklan p0">
    <div class="iklan iklan-300">
    <!-- Paste URL Gambar/Banner Disini -->
   
    </div>
    <div class="clear"></div>
</div>


<div class="iklan_iklan">
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
    
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="clear"></div>
</div>


 

 

 

Slot iklan yang udah ditata ukurannya

 

Kalo ini adalah slot iklan yang udah di di setting ukurannya...

 

Slot Iklan Ukuran 125 x 125 pixels



<div class="iklan_iklan">
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
    
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="iklan">
    <!-- Paste URL Gambar/Banner Disni  -->
   
    </div>
   
    <div class="clear"></div>
</div>

 


Slot Iklan Ukuran 300×250 Pixels


<div class="iklan_iklan p0">
    <div class="iklan iklan-300">
    <!-- Paste URL Gambar/Banner Disini -->
   
    </div>
    <div class="clear"></div>


 

 

oke, akhirnya Selesai juga... nah.  ini adalah hasilnya ya visitor...

Jika ada orang yang mau ngiklan di blog kalian, tinggal masukkan kode pemanggil gambar gif maupun jpg maupun png tepat dibawah kode komentar

<!-- Paste URL Gambar/Banner Disni  -->

Yang sudah saya sediakan diatas ya... sesuaikan ukurannya.. jika kalian belum tau caranya silahkan cari "Cara Membuat Banner Iklan Web di Adobe Photoshop" jika kalian memakai Adobe Photoshop, atau "Cara Membuat Banner Iklan Web di GIMP" jika kalian memakai software pengolah grafis yang gratis atau freeware.



Sebagai Contoh cara untuk memanggil gambarnya :


<a href="#" target="_blank" rel="nofollow noopener" title="Bitcoin">
    <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhj2OKsHQtCgTowhQeZwyXXfFOOlVLBUg5ZIK8_CBp0u9P_W7DtdBgwYzujLUw_b02_5Jxk6_ObMwtAEQ75HW6YEXyHHOkB-F8RQh_WUYJSSBWEilUOZlVF5Z-HY_-fRX0vFbHaHaToAV0/s694/html.JPG" alt="Slot Iklan" title="Slot Iklan responsive" height="125" width="125"/>
    </a>
 

Itu dia gan... usahakan gambarnya kalian sesuaiin dulu ya di photoshop jika kalian udah langganan atau gimp software pengolah grafis freeware biar jadinya bagus gak gepeng.. walaupun di kode atas udah ada pengaturan width maupun height, tetapi alangkah lebih baiknya jika sudah diatur sebelum gambar di upload.






 

 terima kasih udah nyimak dan sekianlah tutorial Membuat Space Iklan sendiri di Blogger.






Sampai Jumpa...

 

 

 

Posting Komentar

Untuk posting kode, bisa di parse dulu gan, pake tool parse yang udah disediakan di website ini https://www.rahmancyber.net/p/parse-code.html

agar kodenya tidak hilang... ^_^

Lebih baru Lebih lama

نموذج الاتصال