Cara Memasang Iklan Sticky Ads Di Blog Non-Amp⚡
Cara Pasang Iklan Sticky Ads di Template Blog Non AMP Versi 2019 Terbaru⚡ - Sebelumnya, aku pernah membahas perihal cara memasang Iklan PopUp Adsense, jadi aku sarankan kepada Anda semua khususnya pengguna template non-amp, bila akan memasang sticky ads di blog non amp, silahkan gunakan arahan yang aku share dibawah. Bicara soal tampilan iklan sticky versi terbaru ini terlihat lebih rapih, menyerupai tampilan iklan pada situs-situs media isu online (situs-situs terkenal).
Sekilas Sticky Ads Non-Amp!
Memasang iklan adsense sticky ads di bawah versi mobile dengan format dan penempatan iklannya, adsense mengatakan beberapa variasi pilihan dan di sesuaikan oleh para publishernya. Ada beberapa tipe unit iklan yang disediakan, menyerupai iklan banner, iklan teks link, iklan responsive, iklan untuk versi mobile, dll.
Mengenai penempatan iklan sticky jenis ini cukup flexible, dan tidak melanggar ketentuan layanan (TOS) Google AdSense.dan versi terbaru ini tidak mengganggu kenyamanan para pengunjung situs.
Bicara soal kelebihan iklan AdSense sticky yang ditempatkan di paruh bawah layar, iklan melayang ini juga "Sticky Fixed Ads", dan mempunyai nilai rasio klik yang cukup bagus.
Karena secara kinerjanya, pengunjung blog akan terus melihat iklan tersebut, meski laman web discroll ke bawah atau ke atas, jadi tentunya mempunyai potensi klik iklan yang lebih besar.
Panduan Memasang Sticky Ads Non-Amp
🔹Pertama, untuk Anda pengguna Blogger, Masuk ke Blogger, klik Theme >> Edit HTML >> kemudian tempel arahan ini sempurna diatas tag epilog </head>
<b:if cond='data:blog.pageType not in {"static_page","error_page"} and data:blog.isMobileRequest == "true" and not data:blog.searchQuery'> <style> /*<![CDATA[*/ .sticky-ad { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; overflow: visible; position: fixed; text-align: center; bottom: 0; left: 0; width: 100%; z-index: 999; max-height: 104px; background-image: none; background-color: #fff; box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2); margin-bottom: 0; padding-top: 4px; transition: all .4s ease-in-out; } .sticky-ad-close-button { position: absolute; width: 28px; height: 28px; top: -28px; right: 0; background-image: url("data:image/svg+xml;charset=utf8,%3csvg width='13' height='13' 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: 9px; background-color: #fff; background-repeat: no-repeat; box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.2); border: none; border-radius: 12px 0 0 0; cursor: pointer; } .sticky-ad-close-button:before { position: absolute; content: ""; top: -20px; right: 0; left: -20px; bottom: 0; } * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } :active, :focus { outline: 0 } /*]]>*/ </style> </b:if>🔹Kedua, taruh arahan berikut sempurna di atas tag epilog </body>
<b:if cond='data:blog.pageType not in {"static_page","error_page"} and data:blog.isMobileRequest == "true" and not data:blog.searchQuery'> <div class='sticky-ad' id='sticky-ad'> <!-- Kode iklan silahkan simpan di bawah ini --> <!-- 320x50 --> <button aria-label='Close this ad' class='sticky-ad-close-button' onclick='document.getElementById('sticky-ad').style.display='none';'/> </div> </b:if>Note: Agar Sticky iklan terlihat rapih, Anda harus memakai iklan berukuran 320×50.
