Memasang Iklan AdSense Sebelum atau Sesudah Elemen Tertentu

Tutorial bagaimana cara pasang, menyisipkan, menyimpan, dan memasukkan slot iklan AdSense sebelum atau sesudah elemen tertentu (insert before dan insert after) di dalam isi artikel Blogspot.
Memasang Iklan AdSense Sebelum Atau Sesudah Elemen Tertentu

Satu lagi teknik penempatan iklan AdSense yang harus kamu coba, yaitu menyisipkan iklan sebelum atau sesudah elemen HTML tertentu. Soal elemen itu akan dijelaskan lebih lanjut di bawah. Sekarang kita langsung masuk ke script utamanya dulu.


Memasukkan Iklan Sebelum Elemen Tertentu

Iklan akan diletakkan sebelum atau di atas elemen HTML yang dipilih, misalnya sebelum heading h2 seperti ini.

Lorem Ipsum is simply dummy text of the printing and typesetting industry.
<!-- Iklan akan muncul disini -->
<h2>SUBHEADING</h2>
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

Bisa juga sebelum elemen dengan nama class atau id tertentu. Misalnya kamu pilih class related.

Lorem Ipsum is simply dummy text of the printing and typesetting industry.
<!-- Iklan akan muncul disini -->
<div class='related'>Related Post</div>
- Related satu
- Related dua
- Related tiga

Pakai kode berikut ini. Simpan script ini DI ATAS </body>.

<b:if cond='data:view.isPost'>
  <div class='ignielInsertBefore'>
    <!-- Kode Iklan AdSense -->
  </div>
  <script> //<![CDATA[
    // Insert Ads Before Element by igniel.com
    eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('s 7=["\\h\\o\\b\\h\\5\\9\\t\\b\\a\\5\\6\\8\\f\\5\\j\\c\\6\\5","\\o\\5\\8\\u\\9\\5\\n\\5\\b\\8\\a\\f\\k\\y\\9\\d\\a\\a\\l\\d\\n\\5","\\w\\x\\5\\6\\k\\r\\5\\9\\5\\v\\8\\c\\6\\D\\9\\9","\\h\\b\\a\\5\\6\\8\\f\\5\\j\\c\\6\\5","\\z\\d\\6\\5\\b\\8\\l\\c\\E\\5"];A B(i,q){m g=p[7[1]](7[0])[0];C(g){m e=p[7[2]](i)[q-1];e[7[4]][7[3]](g,e)}}',41,41,'|||||x65|x72|_0xecd3|x74|x6C|x73|x6E|x6F|x61|_0x71adx5|x42|_0x71adx4|x69|_0x71adx2|x66|x79|x4E|let|x6D|x67|document|_0x71adx3|x53|var|x49|x45|x63|x71|x75|x43|x70|function|ignielInsertBefore|if|x41|x64'.split('|'),0,{}));
    ignielInsertBefore('.post-body h2', '1');
  //]]> </script>
</b:if>

Tambahkan CSS ini agar jaraknya tidak berdekatan dengan konten di atas dan bawahnya. Simpan DI ATAS </style> atau ]]></b:skin>.

/* Insert Ads Before Element by igniel.com */
.ignielInsertBefore {display:block; margin:10px 0px; padding:0px;}

Perhatikan fungsi ignielInsertBefore('.post-body h2', '1').
.post-body adalah elemen HTML tempat isi postingan berada, jadi tidak usah diganti kecuali nama elemennya berbeda (biasanya sih sama untuk semua template). Kemudian iklan disisipkan sebelum elemen HTML dengan tag h2 yang pertama. Jika ada banyak h2 di dalam postingan, maka yang dipilih adalah yang ke-1.

Jika elemen tidak memiliki class atau id, tuliskan hanya nama tag-nya saja. Contohnya seperti h2, h3, h4, br, p, dll.

<!-- Sebelum tag `<br>` ke-10 -->
ignielInsertBefore('.post-body br', '10');

<!-- Sebelum tag `<h3>` ke-3 -->
ignielInsertBefore('.post-body h3', '3');

<!-- Sebelum tag `<div>` ke-2 -->
ignielInsertBefore('.post-body div', '2');

Jika elemen memiliki nama class, tuliskan dengan menambahkan titik (.). Contoh untuk tag HTML <div class='related'> maka harus ditulis .related.

<!-- Sebelum `<div class='related'>` ke-1 -->
ignielInsertBefore('.post-body .related', '1');

Jika elemen memiliki nama id, tuliskan dengan menambahkan tanda pagar / hashtag (#). Contoh untuk tag HTML <div id='info'> maka harus ditulis #info.

<!-- Sebelum id `<div id='info'>` ke-1 -->
ignielInsertBefore('.post-body #info', '1');

Paham kan ya? Kita lanjut ke script berikutnya.


Memasukkan Iklan Setelah Elemen Tertentu

Iklan akan diletakkan setelah atau di bawah elemen HTML yang dipilih, misalnya setelah heading h2 seperti ini.

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

<h2>SUBHEADING</h2> <!-- Iklan akan muncul disini --> Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.

Bisa juga sebelum elemen dengan nama class atau id tertentu, misalnya class related.

Lorem Ipsum is simply dummy text of the printing and typesetting industry.
<div class='related'>Related Post</div>
<!-- Iklan akan muncul disini -->
- Related satu
- Related dua
- Related tiga

Simpan script ini DI ATAS </body>.

<b:if cond='data:view.isPost'>
  <div class='ignielInsertAfter'>
    <!-- Kode Iklan AdSense -->
  </div>
  <script> //<![CDATA[
    // Insert Ads After Element by igniel.com
    eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('v b=["\\d\\g\\a\\d\\6\\8\\y\\a\\c\\6\\9\\7\\k\\j\\7\\6\\9","\\g\\6\\7\\z\\8\\6\\r\\6\\a\\7\\c\\l\\t\\B\\8\\f\\c\\c\\s\\f\\r\\6","\\x\\A\\6\\9\\t\\q\\6\\8\\6\\u\\7\\i\\9\\k\\8\\8","\\a\\6\\w\\7\\q\\d\\F\\8\\d\\a\\g","\\d\\a\\c\\6\\9\\7\\l\\6\\j\\i\\9\\6","\\C\\f\\9\\6\\a\\7\\s\\i\\H\\6"];G D(m,n){p h=o[b[1]](b[0])[0];E(h){p e=o[b[2]](m)[n-1];e[b[5]][b[4]](h,e[b[3]])}}',44,44,'||||||x65|x74|x6C|x72|x6E|_0x7de9|x73|x69|_0x4b0bx5|x61|x67|_0x4b0bx4|x6F|x66|x41|x42|_0x4b0bx2|_0x4b0bx3|document|let|x53|x6D|x4E|x79|x63|var|x78|x71|x49|x45|x75|x43|x70|ignielInsertAfter|if|x62|function|x64'.split('|'),0,{}));
    ignielInsertAfter('.post-body h2', '1');
  //]]> </script>
</b:if>

Untuk pengaturan elemen sama dengan sebelumnya. Baca lagi ke atas.

Lalu simpan CSS ini DI ATAS </style> atau ]]></b:skin>.

/* Insert Ads After Element by igniel.com */
.ignielInsertAfter {display:block; margin:10px 0px; padding:0px;}

Kalau ada yang belum paham silakan komentar di bawah. Semoga bermanfaat.

31
Memasang Iklan AdSense Sebelum atau Sesudah Elemen Tertentu
Memasang Iklan AdSense Sebelum atau Sesudah Elemen Tertentu
Tutorial bagaimana cara pasang, menyisipkan, menyimpan, dan memasukkan slot iklan AdSense sebelum atau sesudah elemen tertentu (insert before dan insert after) di dalam isi artikel Blogspot.
Bagikan ke aplikasi lainnya:
  • WhatsApp
  • Telegram
  • Facebook
  • X (Twitter)
  • Pinterest
  • LinkedIn

Artikel Terkait

31 komentar

  • Menulis kode gunakan <i>kode</i> (kode harus di-parse)
  • Menulis dalam syntax highlighter gunakan <em>kode panjang</em> (kode harus di-parse)
  • Menyisipkan gambar gunakan <strong>URL GAMBAR</strong> (ekstensi .jpg, .png, .gif, .webp, .ico)
  • Centang Beri Tahu Saya untuk mendapatkan notifikasi ke email saat ada yang membalas komentar.
  • Iwan RJ
    01 September, 2022
    Profil: https://www.blogger.com/profile/09080946008520531753
    kalau kita mau nerapkan sebelum dan sesudah id tertentu bersamaan kira2 gmn kodenya mbak. 🙏🙏🙏🙏
  • Iwan RJ
    30 Agustus, 2022
    Profil: https://www.blogger.com/profile/09080946008520531753
    wah mantul banget.
  • Guru Geografi
    29 April, 2022
    Profil: https://www.blogger.com/profile/02574384075010098754
    mba kalau mau tepat di bawah judul postingan, cari kode mana ya?
    • Igniel
      16 Mei, 2022
      Profil: https://www.blogger.com/profile/09199170379661896200
      Simpan iklan DI ATAS kode berikut:
      <data:post.body/>
  • EduGoEdu
    20 Maret, 2021
    Profil: https://www.blogger.com/profile/09566589342782319785
    mbak jika kodenya yang bawah saya ubah jadi ignielInsertBefore('.post-body h2');
    apakah iklan akan muncul di setiap h2(setelah atau sebelum ?
    mohon jawabannya mbak
    • Igniel
      29 April, 2021
      Profil: https://www.blogger.com/profile/09199170379661896200
      Tidak akan muncul karena fungsinya bukan begitu.
      Harusnya begini sesuai artikel:
      ignielInsertBefore('.post-body h2', '3');
  • Eka Wahyu Budi Santoso
    20 Desember, 2019
    Profil: https://www.blogger.com/profile/07161289254018588125
    Kalau pada kalimat tertentu bisa gak ya?
  • Rico
    13 November, 2019
    Profil: https://www.blogger.com/profile/13626655693427922682
    Mantul
  • Hay Tayo
    11 November, 2019
    Profil: https://www.blogger.com/profile/09301230173252082737
    wah mantul , kebetulan pengen nyoba naruh iklan setelah gambar pertama blog , soalnya blog saya gk dipakein kode khusus first image.
  • ARA AUDIO
    10 November, 2019
    Profil: https://www.blogger.com/profile/06087277253042024243
    Bagaimana bikin iklan 300x600 kaya di blog ini gan, di mobil iklan di tengah artikel tapi sticky ketika di scroll
  • Muhammad Gunawan
    29 Maret, 2019
    Profil: https://www.blogger.com/profile/14303289527886812208
    mba saya udah coba nerapin cara di atas pasang iklan ads setelah subheading (h3) tengah artikel pakai iklan responsive. tapi iklannya keluar jalur ya mba, kaya melebar gitu iklannya. uda coba pake kode centr tetep wae kepotong iklannya.
    • A. Abdul Mustahab ツ
      30 Maret, 2019
      Profil: https://www.blogger.com/profile/05409057447679540831
      saya bantu jawab yah.
      tambahkan ini di kode iklannya data-full-width-responsive='false' biar tidak keluar jalur
    • theAsk
      30 September, 2019
      Profil: https://www.blogger.com/profile/03118163808672068512
      Diblog sya jga gitu mba,, coba pasang di bawah img,, tpi tpi iklan.y keluar jalur ampe ke widget... Ngatasin.y gmna ya mba..??
  • Sandy Senjaya
    13 Februari, 2019
    Profil: https://www.blogger.com/profile/11429922247310206942
    Kalau bikin elemen yang khusus untuk menampilkan iklan AdSense, apakah bisa? Caranya gimana ya?

    Misal di dalam postingan HTML sebagai berikut

    Lorem Ipsum is simply dummy text of the printing and typesetting industry.


    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.


    Atau cara lainnya yang intinya pakai elemen khusus untuk memanggil iklan tersebut.
    • Sandy Senjaya
      13 Februari, 2019
      Profil: https://www.blogger.com/profile/11429922247310206942
      Lorem Ipsum is simply dummy text of the printing and typesetting industry.

      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
    • Sandy Senjaya
      13 Februari, 2019
      Profil: https://www.blogger.com/profile/11429922247310206942
      Lorem Ipsum is simply dummy text of the printing and typesetting industry.
      (iklan1)(/iklan1)
      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.
  • A. Abdul Mustahab ツ
    07 Januari, 2019
    Profil: https://www.blogger.com/profile/05409057447679540831
    mbak bagaimana kalau mau nerapin 2 ads di tengah artikel ? saya pake elemen #ads. nah kalau mau nambahin 1 ads lagi apa harus nambah script lagi ? jadi scriptnya dipasang 2 kali.
    • Igniel
      07 Januari, 2019
      Profil: https://www.blogger.com/profile/09199170379661896200
      Tutor di atas khusus buat 1 iklan. Kalau mau dua atau lebih harus pake script multiple ads:
      https://www.igniel.com/2018/11/multiple-iklan-dalam-post.html
  • ngonline06
    12 Desember, 2018
    Profil: https://www.blogger.com/profile/02969011994285107086
    kalau setelah elemen tertentu bisa gak mb?
    • Igniel
      12 Desember, 2018
      Profil: https://www.blogger.com/profile/09199170379661896200
      Tutor di atas kan emang buat masukin iklan abis elemen tertentu.
  • SceneTube
    18 November, 2018
    Profil: https://www.blogger.com/profile/07638604369629707829
    Template nya mantap
  • Reza Harahap
    18 November, 2018
    Profil: https://www.blogger.com/profile/16216454999014453285
    nice info mbak 👍
  • Pus Blacky
    18 November, 2018
    Profil: https://www.blogger.com/profile/13260730401445759194
    Mbak mau tanya.. saya mencoba mengetes blog saya di page insight.. tanpa adsense bisa 90++ pasang adsense drop 50 kebawah..

    Nah aku coba igniel.com bisa 97 (ada adsense)

    Bagaimana caranya supaya
    pagead2.googlesyndication.com
    googleads.g.doubleclick.net
    www.google-analytics.com
    ga pengaruhi hasil tes insight? Terimakasih sebelumnya!
    • Reza Harahap
      18 November, 2018
      Profil: https://www.blogger.com/profile/16216454999014453285
      sudah coba diparse?
    • Igniel
      18 November, 2018
      Profil: https://www.blogger.com/profile/09199170379661896200
      Pake lazy load adsense mas.
    • Admin ismynr Official
      08 Juli, 2020
      Profil: https://www.blogger.com/profile/05319292312193094609
      disini ada tutorialnya ga ya pake lazy load adsense? , apa ga bikin ?
    • Igniel
      08 Juli, 2020
      Profil: https://www.blogger.com/profile/09199170379661896200
      Belum bikin.
  • Anonim
    Anonim17 November, 2018
    Mbak bahas tentang cara agar blog cepat di approve oleh adsense dong, atau bagaimana agar viewer kita tinggi statistiknya....
    • Fizi
      18 November, 2018
      Profil: https://www.blogger.com/profile/12664816184934381226
      sepengalaman saya jadi bloger, mau ada yang nulis artikel tentang yang mas pengenin pun belum tentu yang mas pengenin bisa terjadi. Serius nggak ada yang seinstan kita baca artikel terus terapin dan besoknya langung approve adsense atau pv langsung 1000k/day.

      *salam dari blogger thn 2013 :)
    • Igniel
      18 November, 2018
      Profil: https://www.blogger.com/profile/09199170379661896200
      Bener kata di atas saya. Semuanya butuh waktu. Gak ada yang instan. Dibagusin aja kualitas artikelnya. Nanti lama-lama naik sendiri.
    • Zaid Rabbah
      26 November, 2018
      Profil: https://www.blogger.com/profile/14886514937681637977
      Betul, nulis sesuai passion ajah.