Skip to main content

Recent Disqus

Click Here On Load Disqus

Cara Mudah Membuat Iklan Adsense Melayang Dibagian Bawah Pada Blogger (Iklan Sticky Desktop)

Cara Mudah Membuat Iklan Adsense Melayang Dibagian Bawah Pada Blogger (Iklan Sticky Desktop)
Konten [Tampil]
Cara Mudah Membuat Iklan Adsense Melayang Dibagian Bawah Pada Blogger (Iklan Sticky Desktop)

www.azid45.web.id - Cara Mudah Membuat Iklan Adsense Melayang Dibagian Bawah Pada Blogger (Iklan Sticky Desktop). Assalamualaikum.Wr.Wb, pada kesempatan kali ini saya akan share kepada teman-teman untuk menampilkan iklan sticky pada desktop yang melayang dibagian footer. Pada dasarnya iklan sticky ini muncul pada versi mobile jika anda mengaktifkan iklan auto ads. Iklan tersebut kadang muncul pada bagian header, dan juga kadang muncul pada bagian footer. Hal ini dikarenakan iklan sticky terebut ditampilkan secara otomatis tidak dengan script manual. Untuk versi desktop sendiri pihak google tidak memberikan tampilan iklan sticky, akan tetapi kita bisa mensiasatinya dengan sebuah kode script dan CSS. Dengan sentuhan kode tersebut iklan adsense bisa menyerupai iklan sticky atau melayang sebagaimana kita lihat pada versi mobile.

Apakah iklan sticky pada versi dekstop melanggar kebijakan?, dan bagaimana cara membuat iklan sticky pada versi desktop?. Dari pertanyaan ini, pihak google telah menentukan kebijakan bahwa selama publisher meletakkan iklan melayang pada blognya kurang dari sepertiga dari layar maka tidak melanggar kebijakan google adsense. Oleh karena itu kita sering lihat ukuran iklan sticky pada versi mobile kurang lebih 320px x 50px sehingga tidak memakan ruang artikel lebih dari sepertiganya. Agar tidak melanggar kebijakan google kita juga bisa menampilkan iklan sticky atau iklan melayang pada versi desktop dengan ukuran 728px x 90px. Lantas bagaimana membuatnya?, untuk pertanyaan yang kedua ini cukuplah mudah membuat iklan tersebut meski pihak google tidak menampilkan layanan tersebut pada versi desktop. Kita bisa mengakalinya dengan kode css, untuk melihat caranya anda bisa mengikuti langkah-langkahnya dibawah ini:

Pertama, login pada blogger terlebih dahulu, setelah itu masuk pada menu template atau thema kemudian pilih edit HTML

Kedua, letakkan kode css berikut tepat diatas kode </head>


<style>
.displayblock{display:block}
.fixedx{width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:999;-webkit-transform:translateZ(0);}
.cursor{cursor:pointer;}
.vertical{vertical-align:middle;}
.fixedx-1{text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto}
.iklan-sticky-mobile{display:inline-block;width:320px;height:50px}
.iklan-sticky{display:inline-block;width:728px;height:90px}
.close-button-sticky{width:15px;height:10px;background-image:url("data:image/svg+xml;charset=utf8,%3csvg width='5' height='5' viewBox='341 8 13 13' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%234F4F4F' d='M354 9.31L352.69 8l-5.19 5.19L342.31 8 341 9.31l5.19 5.19-5.19 5.19 1.31 1.31 5.19-5.19 5.19 5.19 1.31-1.31-5.19-5.19z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");background-size:13px 13px;background-position:center;background-color:rgba(255,255,255,.7);background-repeat:no-repeat;box-shadow:0 -1px 1px 0 rgba(0,0,0,.2);border:none;border-radius:0;cursor:pointer}
</style>

Ketiga, setelah copas kode css diatas dan meletakkan di atas kode </head> langkah selanjutnya adalah copas kode berikut dan letakkan diatas kode </body>


<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
<div class='fixedx' id='fixedban'>
<div><a class='cursor' id='close-fixedban' onclick='document.getElementById(&apos;fixedban&apos;).style.display = &apos;none&apos;;'><center><div class='vertical close-button-sticky'/></center></a></div>
<div class='fixedx-1'>
<ins class='adsbygoogle iklan-sticky' data-ad-client='ca-pub-xxxxx' data-ad-slot='xxxxx'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</b:if>

Keempat, ubahlah data-ad-slot dengan kode slot iklan responsive milik anda serta ubah pula kode ca-pub dengan kode ca-pub milik sobat. Setelah itu sobat bisa Save Template

Untuk lebih jelasnya, anda bisa melihat contoh peletakkan dibawah ini


<HTML .......................>
<head>


.......................

.....................
<style>
.displayblock{display:block}
.fixedx{width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:999;-webkit-transform:translateZ(0);}
.cursor{cursor:pointer;}
.vertical{vertical-align:middle;}
.fixedx-1{text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto}
.iklan-sticky-mobile{display:inline-block;width:320px;height:50px}
.iklan-sticky{display:inline-block;width:728px;height:90px}
.close-button-sticky{width:15px;height:10px;background-image:url("data:image/svg+xml;charset=utf8,%3csvg width='5' height='5' viewBox='341 8 13 13' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%234F4F4F' d='M354 9.31L352.69 8l-5.19 5.19L342.31 8 341 9.31l5.19 5.19-5.19 5.19 1.31 1.31 5.19-5.19 5.19 5.19 1.31-1.31-5.19-5.19z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");background-size:13px 13px;background-position:center;background-color:rgba(255,255,255,.7);background-repeat:no-repeat;box-shadow:0 -1px 1px 0 rgba(0,0,0,.2);border:none;border-radius:0;cursor:pointer}
</style>


</head>

<body>


.........................

....................

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
<div class='fixedx' id='fixedban'>
<div><a class='cursor' id='close-fixedban' onclick='document.getElementById(&apos;fixedban&apos;).style.display = &apos;none&apos;;'><center><div class='vertical close-button-sticky'/></center></a></div>
<div class='fixedx-1'>
<ins class='adsbygoogle iklan-sticky' data-ad-client='ca-pub-xxxxx' data-ad-slot='xxxxx'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</b:if>

</body>

</HTML>


Demikianlah artikel saya tentang Cara Mudah Membuat Iklan Adsense Melayang Dibagian Bawah Pada Blogger (Iklan Sticky Desktop). Semoga bermanfaat, amin.
Reactions
PERHATIAN:Jika anda mendownload di blog ini, maka anda akan di redirect terlebih dahulu ke laman Short Safelink untuk keamanan blog. Oleh karena itu jika terjadi error 404 maka terjadi kesalahan dalam klik di laman redirect atau terjadi refresh laman redirect. Untuk mengatasinya anda bisa mengulang kembali klik file yang akan anda download di blog ini. Dan Jika anda ingin bertanya atau bantuan bisa kontak kami dengan Klik Disini atau nomor berikut 085733513782 - Terima kasih.
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui
Buka Komentar
Tutup Komentar