Salin dan Bagikan
Cara Memasang Kode AdSense di Website dengan Benar

Cara Memasang Kode AdSense di Website dengan Benar

Pengenalan Implementasi Kode AdSense

Setelah akun AdSense Anda disetujui, langkah selanjutnya adalah memasang kode iklan di website. Proses ini mungkin terdengar teknis dan menakutkan bagi pemula, namun sebenarnya cukup straightforward jika Anda mengikuti panduan dengan benar.

Memasang kode AdSense dengan benar sangat penting karena kesalahan implementasi bisa mengakibatkan:

  • Iklan tidak muncul sama sekali
  • Iklan muncul di tempat yang salah
  • Masalah dengan tracking dan reporting
  • Pelanggaran kebijakan AdSense
  • Revenue yang tidak optimal

Dua Metode Utama Pemasangan

Ada dua cara utama untuk memasang AdSense di website Anda:

1. Ad Code Manual: Anda copy-paste kode iklan ke lokasi spesifik di HTML website.

2. Auto Ads: Google secara otomatis menempatkan iklan di lokasi optimal menggunakan machine learning.

Artikel ini akan membahas kedua metode secara detail agar Anda bisa memilih yang paling sesuai untuk website Anda.

Persiapan Sebelum Memasang Kode

1. Backup Website Anda

Sebelum melakukan perubahan apapun pada kode website:

Backup Files: Download semua file website Anda atau buat backup melalui hosting control panel.

Backup Database: Jika menggunakan CMS seperti WordPress, backup juga database Anda.

Test Environment: Jika possible, test implementasi di staging environment dulu sebelum apply ke live site.

2. Akses ke Website

Pastikan Anda memiliki akses untuk edit kode website:

Direct File Access: Via FTP/SFTP atau File Manager di hosting control panel.

CMS Admin Access: Jika menggunakan WordPress, Joomla, atau CMS lain.

Theme Editor Access: Kemampuan untuk edit file tema website.

3. Pahami Struktur Website

Sebelum memasang kode, pahami struktur website Anda:

Header: Bagian atas website, biasanya file header.php atau similar.

Sidebar: Bagian samping, biasanya file sidebar.php.

Content Area: Bagian konten utama.

Footer: Bagian bawah website.

Cara Mendapatkan Kode AdSense

1. Login ke Dashboard AdSense

Masuk ke akun AdSense Anda di https://adsense.google.com

2. Buat Ad Unit

Langkah-langkah:

  1. Klik menu “Ads” di sidebar kiri
  2. Pilih “By ad unit”
  3. Klik tombol “New ad unit” atau “+ Ad unit”
  4. Pilih jenis ad unit yang ingin Anda buat

3. Jenis Ad Unit

Display Ads: Iklan banner standar dalam berbagai ukuran

  • Square dan rectangle (336x280, 300x250, 250x250, 200x200)
  • Skyscraper (120x600, 160x600, 300x600)
  • Leaderboard (728x90, 970x90, 970x250)
  • Mobile (320x50, 320x100)

In-feed Ads: Iklan yang muncul di antara feed content

  • Custom untuk blog feeds
  • Custom untuk list-style content
  • Native style yang blend dengan konten

In-article Ads: Iklan yang muncul di dalam artikel

  • Otomatis placed di antara paragraf
  • Native look yang match dengan content style

Multiplex Ads: Grid ads yang menampilkan multiple items

  • Recommendation style
  • Grid layout

Untuk detail lebih lanjut, lihat Jenis-Jenis Iklan AdSense dan Cara Menggunakannya .

4. Konfigurasi Ad Unit

Nama Ad Unit: Beri nama yang deskriptif (contoh: “Sidebar Top - 300x250”)

Ad Size: Pilih ukuran (Responsive direkomendasikan untuk flexibility)

Ad Type: Pilih text & display ads atau text only

Setelah konfigurasi, klik “Create” untuk generate kode.

5. Copy Kode

Kode akan muncul dalam format seperti ini:

<script
  async
  src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXXXXX"
  crossorigin="anonymous"
></script>
<!-- Nama Ad Unit -->
<ins
  class="adsbygoogle"
  style="display:block"
  data-ad-client="ca-pub-XXXXXXXXXXXXXXXX"
  data-ad-slot="1234567890"
  data-ad-format="auto"
  data-full-width-responsive="true"
></ins>
<script>
  (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Copy kode ini untuk dipasang di website Anda.

Memasang Kode di WordPress

Metode 1: Plugin AdSense

Recommended Plugins:

  • Advanced Ads
  • Ad Inserter
  • WP Insert
  • AdSanity

Cara Menggunakan:

  1. Install dan activate plugin
  2. Paste kode AdSense di plugin settings
  3. Pilih lokasi di mana iklan akan ditampilkan
  4. Save settings

Keuntungan Plugin:

  • Mudah digunakan tanpa coding
  • Control placement dengan visual interface
  • Bisa set conditional display (mobile only, logged-in users, etc.)
  • A/B testing features di beberapa plugin

Metode 2: Widget Area

Jika tema WordPress Anda memiliki widget areas:

  1. Go to Appearance > Widgets
  2. Add Custom HTML atau Text widget ke sidebar atau footer area
  3. Paste kode AdSense ke dalam widget
  4. Save widget

Tips:

  • Beri judul widget yang jelas untuk tracking (misalnya “AdSense Sidebar Top”)
  • Test appearance di different screen sizes
  • Jangan overload sidebar dengan terlalu banyak ads

Metode 3: Edit Theme Files

Untuk kontrol lebih granular:

Sidebar Ads:

  1. Go to Appearance > Theme Editor
  2. Open sidebar.php file
  3. Paste kode AdSense di lokasi yang diinginkan
  4. Wrap dengan div untuk styling:
<div class="adsense-widget">
    <!-- Paste AdSense code here -->
</div>

In-Article Ads:

  1. Edit single.php atau content.php
  2. Find lokasi di dalam content loop
  3. Paste kode setelah beberapa paragraf

Header/Footer Ads:

  1. Edit header.php atau footer.php
  2. Paste kode di lokasi yang sesuai

PERINGATAN:

  • Backup theme sebelum edit
  • Perubahan akan hilang saat update theme
  • Pertimbangkan gunakan child theme

Metode 4: Functions.php

Untuk developer yang comfortable dengan PHP:

// Add to functions.php
function insert_adsense_after_paragraph($content) {
    if (is_single() && !is_admin()) {
        $ad_code = '<!-- Your AdSense code here -->';
        $paragraphs = explode('</p>', $content);

        // Insert ad after 2nd paragraph
        if (count($paragraphs) > 2) {
            $paragraphs[2] .= $ad_code;
        }

        $content = implode('</p>', $paragraphs);
    }
    return $content;
}
add_filter('the_content', 'insert_adsense_after_paragraph');

Memasang Kode di HTML Statis

1. Identifikasi Lokasi

Tentukan di mana Anda ingin menempatkan iklan:

Header: Di file header.html atau di bagian <header> tag

Sidebar: Di div dengan class atau id sidebar

Content: Di dalam main content area

Footer: Di file footer.html atau di bagian <footer> tag

2. Edit File HTML

Via Text Editor:

  1. Download file HTML via FTP
  2. Open dengan text editor (Notepad++, Sublime Text, VS Code)
  3. Find lokasi yang diinginkan
  4. Paste kode AdSense
  5. Save dan upload kembali via FTP

Via cPanel File Manager:

  1. Login ke cPanel
  2. Open File Manager
  3. Navigate ke file yang ingin diedit
  4. Right click > Edit
  5. Paste kode AdSense
  6. Save changes

3. Contoh Implementasi

Sidebar Ad:

<aside class="sidebar">
  <div class="widget">
    <h3>Sidebar Title</h3>
    <div class="widget-content">
      <!-- Regular sidebar content -->
    </div>
  </div>

  <!-- AdSense Widget -->
  <div class="widget adsense-widget">
    <!-- Paste AdSense code here -->
  </div>
</aside>

In-Content Ad:

<article>
  <h1>Article Title</h1>

  <p>First paragraph...</p>
  <p>Second paragraph...</p>

  <!-- AdSense In-Article -->
  <div class="adsense-content">
    <!-- Paste AdSense code here -->
  </div>

  <p>Third paragraph continues...</p>
</article>

Header Ad:

<header>
  <div class="logo">
    <img src="logo.png" alt="Site Logo" />
  </div>

  <!-- Header AdSense -->
  <div class="header-ad">
    <!-- Paste AdSense code here -->
  </div>

  <nav>
    <!-- Navigation menu -->
  </nav>
</header>

Memasang Kode di Platform Lain

Blogger/Blogspot

  1. Login ke Blogger dashboard
  2. Go to Layout
  3. Click Add a Gadget di lokasi yang diinginkan
  4. Select HTML/JavaScript
  5. Paste kode AdSense
  6. Save gadget

Alternative:

  • Go to Theme > Edit HTML
  • Find <body> tag atau lokasi spesifik
  • Paste kode
  • Save theme

Wix

  1. Click Add button di editor
  2. Select More > HTML Code
  3. Drag ke lokasi yang diinginkan
  4. Paste AdSense code
  5. Adjust settings
  6. Publish site

Squarespace

  1. Edit page atau post
  2. Add Code Block
  3. Paste AdSense code
  4. Save changes
  5. Publish

Ghost

  1. Go to post editor
  2. Add HTML Card
  3. Paste AdSense code
  4. Publish post

Atau edit theme files untuk global placement.

Memasang Auto Ads

Auto Ads lebih mudah karena hanya perlu satu kode di header website.

1. Get Auto Ads Code

  1. Login ke AdSense dashboard
  2. Go to Ads > Overview
  3. Click Get started di Auto ads section
  4. Copy kode yang diberikan

Kode akan terlihat seperti:

<script
  async
  src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXXXXX"
  crossorigin="anonymous"
></script>

2. Paste di Header

WordPress:

  • Install plugin seperti “Insert Headers and Footers”
  • Paste kode di Header section
  • Save

Atau edit header.php:

  • Paste kode sebelum closing </head> tag

HTML Statis:

  • Open header.html atau main HTML file
  • Paste kode sebelum </head> tag
  • Save dan upload

3. Configure Auto Ads

  1. Return ke AdSense dashboard
  2. Go to Ads > Overview > Auto ads
  3. Select your site
  4. Click Edit (pencil icon)
  5. Preview akan show placement suggestions
  6. Toggle on/off ad formats yang diinginkan:
    • Anchor ads
    • Vignette ads
    • In-page ads
    • Multiplex ads
  7. Adjust settings seperti ad load
  8. Click Apply to site

Iklan akan mulai muncul dalam beberapa jam (bisa sampai 24 jam).

Untuk optimasi lebih lanjut, baca Auto Ads AdSense Cara Kerja dan Optimasinya .

Verifikasi Kode Terpasang Benar

1. Check dengan View Source

  1. Buka website Anda
  2. Right click > View Page Source
  3. Search (Ctrl+F) untuk “adsbygoogle”
  4. Pastikan kode muncul di source

2. Check dengan Browser Console

  1. Open Developer Tools (F12)
  2. Go to Console tab
  3. Look for AdSense related messages
  4. Tidak ada error berarti kode terpasang benar

3. Check dengan AdSense Extension

Install Google Publisher Toolbar Chrome extension:

  1. Visit your website
  2. Click extension icon
  3. Akan show AdSense ads detected dan info tentang mereka

4. Wait for Ads to Appear

Timeline:

  • Manual ads: Biasanya muncul dalam 10-20 menit
  • Auto ads: Bisa 1-24 jam pertama kali
  • Blank spaces normal di awal saat Google learning

Jika Ads Tidak Muncul Setelah 24 Jam:

  • Check kode paste dengan benar
  • Verify tidak ada JavaScript errors
  • Check AdSense dashboard untuk issues
  • Ensure website accessible publicly (not password protected)

Styling dan Customization

1. Container Styling

Wrap AdSense code dengan div untuk styling:

<div class="adsense-container">
  <span class="ad-label">Advertisement</span>
  <!-- AdSense code -->
</div>

CSS:

.adsense-container {
  margin: 20px 0;
  padding: 10px;
  background: #f5f5f5;
  border: 1px solid #ddd;
  text-align: center;
}

.ad-label {
  display: block;
  font-size: 11px;
  color: #999;
  margin-bottom: 5px;
  text-transform: uppercase;
}

2. Responsive Adjustments

Untuk mobile optimization:

@media (max-width: 768px) {
  .adsense-container {
    margin: 15px 0;
    padding: 5px;
  }

  /* Hide certain ads on mobile if needed */
  .desktop-only-ad {
    display: none;
  }
}

@media (min-width: 769px) {
  .mobile-only-ad {
    display: none;
  }
}

3. Lazy Loading

Untuk improve page speed, lazy load ads:

<div class="adsense-lazy" data-ad-client="ca-pub-XXX" data-ad-slot="123456">
  <!-- Placeholder -->
</div>

<script>
  // Lazy load ads when in viewport
  const observer = new IntersectionObserver((entries) => {
    entries.forEach((entry) => {
      if (entry.isIntersecting) {
        const ad = entry.target;
        // Load AdSense code here
        observer.unobserve(ad);
      }
    });
  });

  document.querySelectorAll(".adsense-lazy").forEach((ad) => {
    observer.observe(ad);
  });
</script>

Common Issues dan Troubleshooting

1. Ads Tidak Muncul

Possible Causes:

  • Kode tidak paste dengan benar
  • Ad blocker active
  • JavaScript errors di page
  • Website not publicly accessible
  • Policy violations

Solutions:

  • Verify kode via View Source
  • Test di incognito mode tanpa extensions
  • Check browser console untuk errors
  • Ensure site accessible dari different networks
  • Review AdSense dashboard untuk policy issues

2. Blank Ad Spaces

Possible Causes:

  • Insufficient advertiser demand
  • Low CPC niche
  • Traffic dari low-value countries
  • New site dengan limited data

Solutions:

  • Wait 24-48 jam untuk system learning
  • Create more quality content
  • Drive more traffic
  • Be patient, fill rate improves over time

3. Ads Muncul di Wrong Location

Possible Causes:

  • Kode paste di wrong place
  • Theme conflicts
  • CSS affecting placement
  • Auto Ads override manual placement

Solutions:

  • Review kode placement di files
  • Check theme documentation
  • Adjust CSS styling
  • Disable Auto Ads jika conflict dengan manual ads

4. Multiple Ad Code Sections

Issue: Accidentally paste first <script> tag multiple times.

Solution: First script tag (async src) hanya perlu dipaste SEKALI per page, di header. Untuk multiple ad units di same page, paste hanya bagian <ins> dan last <script> dengan push.

Benar:

<head>
  <!-- Paste only once -->
  <script async src="...adsbygoogle.js"></script>
</head>

<body>
  <!-- First ad unit -->
  <ins class="adsbygoogle" ...></ins>
  <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
  </script>

  <!-- Second ad unit -->
  <ins class="adsbygoogle" ...></ins>
  <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
  </script>
</body>

Best Practices

1. Strategic Placement

High-Visibility Locations:

  • Above the fold (terlihat tanpa scroll)
  • End of articles (setelah user finish reading)
  • Sidebar above the fold
  • Between content sections

Avoid:

  • Hiding ads
  • Too many ads di single screen
  • Misleading placements

2. Balance dengan User Experience

  • Jangan sacrifice UX untuk ad revenue
  • Maximum 3 ad units per standard page (meskipun limit sudah dihapus)
  • Space ads appropriately
  • Ensure content tetap primary focus

3. Mobile Optimization

  • Use responsive ad units
  • Avoid large ads di mobile yang menutupi content
  • Test di various mobile devices
  • Consider mobile-specific placements

4. Performance Optimization

  • Use async loading (built into AdSense code)
  • Consider lazy loading untuk ads below fold
  • Minimize other scripts yang conflict
  • Monitor page speed impact

5. Documentation

  • Keep record of ad placements
  • Document ad unit names dan locations
  • Track performa each placement
  • Note any changes atau experiments

Kesimpulan

Memasang kode AdSense dengan benar adalah foundation untuk successful monetization. Key points untuk diingat:

  1. Pilih metode yang sesuai: Auto Ads untuk simplicity, Manual ads untuk control
  2. Test thoroughly: Verify ads muncul dengan benar di all devices
  3. Optimize placement: Strategic locations untuk max revenue tanpa mengorbankan UX
  4. Monitor performance: Track results dan adjust berdasarkan data
  5. Stay compliant: Follow semua AdSense policies untuk placement

Dengan implementasi yang proper, Anda set foundation untuk revenue stream yang sustainable dari website Anda. Start dengan beberapa ad placements, monitor performance, dan optimize over time berdasarkan data yang Anda collect.

Ingat bahwa perfect ad setup tidak terjadi overnight. It’s iterative process yang require testing, learning, dan continuous optimization. Be patient dan focus pada providing value kepada visitors sambil strategically monetizing traffic Anda.

Link Postingan : https://www.tirinfo.com/cara-memasang-kode-adsense-di-website-dengan-benar/

Hendra WIjaya
Tirinfo
9 minutes.
8 December 2025