Cara Memasang Iklan AdSense Parallax di Tengah Postingan Otomatis

Pengantar

Pemasangan iklan AdSense adalah salah satu cara yang efektif untuk menghasilkan pendapatan dari blog Anda. Namun, agar iklan tersebut lebih menonjol dan meningkatkan tingkat keterlibatan pengunjung, Anda dapat memasang iklan AdSense secara parallax di tengah postingan. Dalam artikel ini, kami akan membahas langkah-langkah lengkap untuk memasang iklan AdSense parallax di tengah postingan secara otomatis dalam template blogspot.

Mengapa Iklan AdSense Parallax?

Iklan AdSense parallax menambah dimensi ke dalam pengalaman pengguna di situs web Anda. Dengan efek parallax, iklan akan bergerak saat pengunjung menggulir halaman, menarik perhatian mereka dan meningkatkan kemungkinan klik. Ini bisa menjadi strategi yang efektif untuk meningkatkan pendapatan iklan Anda.

Langkah-langkah Memasang Iklan AdSense Parallax di Blogspot

1. Persiapkan Kode Iklan AdSense

  • Masuk ke akun AdSense Anda.
  • Buat unit iklan yang Anda inginkan dengan ukuran yang sesuai.
  • Salin kode iklan yang dihasilkan.

2. Edit Template Blogspot

  • Masuk ke dasbor Blogger.
  • Pilih menu “Tata Letak”.
  • Pilih opsi “Edit HTML”.

3. Cari Tempat untuk Memasukkan Kode Iklan

  • Cari <data:post.body/> dalam kode HTML template Anda. Ini adalah tempat di mana konten postingan ditampilkan.

4. Sisipkan Kode Iklan AdSense

  • Sisipkan kode iklan AdSense di antara tag <data:post.body/>.
<div class="parallax-container">
   <div class="parallax"><img src="background.jpg"></div>
   <div class="center-align">
      <!-- Tempatkan kode iklan AdSense di sini -->
      <!-- Ganti dengan kode iklan AdSense yang telah Anda salin -->
      <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
      <ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-1234567890"
         data-ad-slot="1234567890"
         data-ad-format="auto"
         data-full-width-responsive="true"></ins>
      <script>
         (adsbygoogle = window.adsbygoogle || []).push({});
      </script>
   </div>
</div>

Pastikan untuk mengganti “background.jpg” dengan gambar latar belakang yang sesuai dengan konten Anda.

5. Tambahkan CSS untuk Efek Parallax

  • Tambahkan kode CSS di bawah ini di bagian <style> dari template Anda untuk memberikan efek parallax pada iklan.
.parallax-container {
   position: relative;
   overflow: hidden;
   height: 400px; /* Sesuaikan tinggi dengan gambar latar belakang */
}

.parallax {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-attachment: fixed;
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
}

.center-align {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 100%;
   text-align: center;
}

Pastikan untuk menyesuaikan tinggi .parallax-container sesuai dengan gambar latar belakang yang Anda gunakan.

Kesimpulan

Memasang iklan AdSense parallax di tengah postingan dapat meningkatkan keterlibatan pengunjung dan pendapatan iklan Anda. Dengan mengikuti langkah-langkah di atas dan memanfaatkan efek parallax, Anda dapat membuat iklan Anda lebih menonjol di dalam konten Anda. Jangan lupa untuk selalu memantau performa iklan dan melakukan penyesuaian jika diperlukan untuk hasil yang optimal.

You might be interested in …