Hello sobat Bloggermuda kali ini admin bakalan menjabarkan mengenai cara membuat loading animasi adsense menggunakan SVG huruf Ad hanya dengan menggunakan kode CSS
Info: Jika kamu sudah penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama
Loading animasi adsense
Loading animasi AdSense adalah animasi yang muncul saat iklan AdSense sedang dimuat di sebuah halaman web. Animasi tersebut biasanya berupa ikon atau gambar yang berputar atau bergerak untuk menunjukkan kepada pengguna bahwa iklan sedang dimuat, untuk tampilan dari loading animasi adsense pada postingan ini menggunakan icon SVG huruf Ad, Ini membantu memberikan pengalaman pengguna yang lebih baik dan mengurangi kebingungan ketika iklan sedang diproses untuk ditampilkan.
Contoh Tampilan
Nah dari pada penasaran dengan contoh tampilan dari loading animasi adsense tersebut silahkan periksa menggunakan tombol di bawah ini
Peringatan: Loading iklan adsense ini hanya berfungsi ketika kamu menampikan iklan menggunakan kode Unit iklan adsense
Cara pembuatan
Baiklah sekarang saatnya admin bakalan menjabarkan mengenai cara membuat loading iklan adsense pure menggunakan kode CSS, silahkan baca dan ikuti setiap arahan yang bakal admin jelaskan di bawah ini
- Silahkan login ke blogger menggunakan akun google anda
- Kemudian silahkan anda pergi ke menu Tema kemudian pilih menu Edit HTML
- Selanjutnya di dalam menu Edit HTML silahkan cari kode ]]></b:skin>
- Jika sudah ketemu silahkan salin kode CSS di bawah ini kemudian taruh di atasnya
- Kemudian simpan template dan lihat bagaimana hasilnya
<!--[ Loading ads adsense by ICloudice ]-->
.adsbygoogle{background:rgba(0,0,0,.05) url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBmaWxsPSIjNDc0NzQ3IiBkPSJNMTU3LjUyIDI3MmgzNi45NkwxNzYgMjE4Ljc4ek0zNTIgMjU2Yy0xMy4yMyAwLTI0IDEwLjc3LTI0IDI0czEwLjc3IDI0IDI0IDI0IDI0LTEwLjc3IDI0LTI0LTEwLjc3LTI0LTI0LTI0TTQ2NCA2NEg0OEMyMS41IDY0IDAgODUuNSAwIDExMnYyODhjMCAyNi41IDIxLjUgNDggNDggNDhoNDE2YzI2LjUgMCA0OC0yMS41IDQ4LTQ4VjExMmMwLTI2LjUtMjEuNS00OC00OC00OE0yNTAuNTggMzUyaC0xNi45NGMtNi44MSAwLTEyLjg4LTQuMzItMTUuMTItMTAuNzVMMjExLjE1IDMyMGgtNzAuMjlsLTcuMzggMjEuMjVBMTYgMTYgMCAwIDEgMTE4LjM2IDM1MmgtMTYuOTRjLTExLjAxIDAtMTguNzMtMTAuODUtMTUuMTItMjEuMjVMMTQwIDE3Ni4xMkEyMy45OTUgMjMuOTk1IDAgMCAxIDE2Mi42NyAxNjBoMjYuNjZBMjMuOTkgMjMuOTkgMCAwIDEgMjEyIDE3Ni4xM2w1My42OSAxNTQuNjJjMy42MSAxMC40LTQuMTEgMjEuMjUtMTUuMTEgMjEuMjVNNDI0IDMzNmMwIDguODQtNy4xNiAxNi0xNiAxNmgtMTZjLTQuODUgMC05LjA0LTIuMjctMTEuOTgtNS42OC04LjYyIDMuNjYtMTguMDkgNS42OC0yOC4wMiA1LjY4LTM5LjcgMC03Mi0zMi4zLTcyLTcyczMyLjMtNzIgNzItNzJjOC40NiAwIDE2LjQ2IDEuNzMgMjQgNC40MlYxNzZjMC04Ljg0IDcuMTYtMTYgMTYtMTZoMTZjOC44NCAwIDE2IDcuMTYgMTYgMTZ6Ii8+Cjwvc3ZnPgo=") center / 26px no-repeat;background-size:25px 25px}