Integrasi AdMob

1Buat Akun AdMob#

Daftar akun Google AdMob. Anda memerlukan akun Google untuk memulai. AdMob adalah platform iklan seluler dari Google.

Buka AdMob →

2Tambahkan Aplikasi Anda#

Di dasbor AdMob:

• Klik 'Apps' di bilah samping
• Klik 'Add App'
• Pilih 'No' untuk 'Is your app listed on a supported app store?'
• Masukkan nama aplikasi Anda
• Pilih 'Android' sebagai platform
• Klik 'Add'

3Dapatkan App ID#

Setelah membuat aplikasi Anda:

• Salin App ID yang ditampilkan (format: ca-app-pub-XXXXXXXXXXXXXXXX~XXXXXXXXXX)
• Ini berbeda dari Ad Unit ID Anda
• Anda akan menggunakannya di AndroidManifest.xml

App ID format:
ca-app-pub-1234567890123456~1234567890

4Buat Ad Unit (Banner)#

Di aplikasi AdMob Anda:

• Klik tab 'Ad units'
• Klik 'Add ad unit'
• Pilih 'Banner'
• Masukkan nama ad unit (mis., 'Main Banner')
• Klik 'Create ad unit'
• Salin Ad Unit ID

Banner Ad Unit ID format:
ca-app-pub-1234567890123456/1234567890

5Penyiapan di AppMint#

Di AppMint, Langkah 3:

1. Aktifkan 'AdMob Ads' dan tempel App ID AdMob Anda (yang memakai ~)
2. Ad Control: biarkan 'Automatic' - aplikasi menempatkan iklan untuk Anda
3. Aktifkan 'Banner Ad', pilih Ad Position (Bottom atau Top) dan tempel Banner Ad Unit ID Anda (yang memakai /)
4. Lanjutkan dengan pengaturan lain dan buat aplikasi Anda

Ad Unit ID (not App ID):
ca-app-pub-XXXXXXXXXXXXXXXX/YYYYYYYYYY

6Uji Iklan di Aplikasi Anda#

Selama pengembangan, gunakan ID uji resmi Google untuk menghindari pelanggaran kebijakan. Salin dan tempel ini ke generator:

📋 AdMob App ID:
ca-app-pub-3940256099942544~3347511713

📋 Banner Ad Unit ID:
ca-app-pub-3940256099942544/6300978111

📋 Interstitial Ad Unit ID:
ca-app-pub-3940256099942544/1033173712

📋 Rewarded Ad Unit ID:
ca-app-pub-3940256099942544/5224354917

📋 Publisher ID:
pub-3940256099942544

📋 Developer Website:
https://example.com

ID uji ini menampilkan iklan yang tampak nyata tanpa menghasilkan pendapatan atau melanggar kebijakan. Ganti dengan ID asli Anda untuk produksi.

Test IDs for Generator:

AdMob App ID:       ca-app-pub-3940256099942544~3347511713
Banner Ad ID:       ca-app-pub-3940256099942544/6300978111
Interstitial ID:    ca-app-pub-3940256099942544/1033173712
Rewarded Ad ID:     ca-app-pub-3940256099942544/5224354917
Publisher ID:       pub-3940256099942544
Developer URL:      https://example.com

7Iklan Interstisial#

Iklan interstisial adalah iklan layar penuh yang menutupi seluruh antarmuka aplikasi. Pengguna dapat menutupnya untuk kembali ke aplikasi.

📺 Cara Mengaktifkan (Langkah 3, Ad Control 'Automatic'):

1. Aktifkan 'Full Screen Ad'
2. Ad Type: pilih 'Interstitial Ad'
3. Masukkan Interstitial Ad Unit ID Anda (atau kosongkan untuk iklan uji)
4. Pilih Trigger Mode:

🔄 Setelah Navigasi (default):
Iklan tampil setiap N navigasi halaman. Misalnya, jika diatur 4, iklan muncul setelah pemuatan halaman ke-4, ke-8, ke-12, dan seterusnya.

📱 App Open:
Iklan tampil sekali tepat setelah layar splash, saat aplikasi pertama kali dibuka.

👆 Sesuai Permintaan:
Tidak ada iklan otomatis - halaman Anda menampilkannya saat diketuk dengan WebToApk.showInterstitialAd().

⚠️ Ad Type adalah satu pilihan: Interstisial ATAU Rewarded, bukan keduanya.

Example: every 4 page navigations

Page 1 → No ad
Page 2 → No ad
Page 3 → No ad
Page 4 → 📺 Interstitial Ad shown!
Page 5 → No ad
Page 6 → No ad
Page 7 → No ad
Page 8 → 📺 Interstitial Ad shown!
...

8Iklan Rewarded#

Iklan rewarded adalah iklan video layar penuh yang ditonton pengguna untuk mendapatkan hadiah. Iklan ini memberi pendapatan lebih tinggi daripada iklan banner atau interstisial.

🎁 Cara Mengaktifkan (Langkah 3, Ad Control 'Automatic'):

1. Aktifkan 'Full Screen Ad'
2. Ad Type: pilih 'Rewarded Ad'
3. Masukkan Rewarded Ad Unit ID Anda (atau kosongkan untuk iklan uji)
4. Pilih Trigger Mode:

🔄 Setelah Navigasi (default):
Mirip interstisial - iklan tampil setiap N pemuatan halaman. 'Show ad after every N page navigations' menentukan N. Defaultnya 4.

📱 App Open:
Video hadiah tampil sekali saat aplikasi pertama kali dibuka setelah splash.

👆 Sesuai Permintaan:
Tidak ada iklan otomatis - tombol 'tonton iklan untuk dapat hadiah' di halaman Anda memanggil WebToApk.showRewardedAd().

💡 Berapa kali navigasi?
Lebih rendah = lebih banyak iklan (pendapatan lebih besar tetapi pengalaman pengguna lebih buruk). Lebih tinggi = lebih sedikit iklan (pengalaman lebih baik tetapi pendapatan lebih kecil). Disarankan: 3-5.

⚠️ Kebijakan Google: iklan rewarded membutuhkan persetujuan pengguna. Pada mode After Navigations dan App Open, aplikasi Anda lebih dulu menampilkan prompt 'Watch an ad?' dengan tombol 'No thanks'; iklan hanya diputar jika mereka setuju.

Revenue comparison (approximate):

Banner Ads:       $0.10 - $0.50 per 1000 views
Interstitial Ads: $1 - $5 per 1000 views
Rewarded Ads:     $5 - $15 per 1000 views

Recommended N (page navigations per ad):
Aggressive:  2-3 (more ads, more revenue)
Balanced:    4-5 (recommended)
Conservative: 6-10 (fewer ads, better UX)

9Persetujuan & Kebijakan Privasi (Wajib)#

⚠️ AdMob mewajibkan mekanisme persetujuan bagi pengguna di EEA, Inggris, Swiss, dan negara bagian AS.

Ini ditangani otomatis oleh aplikasi yang dibuat menggunakan User Messaging Platform (UMP) dari Google. Aplikasi akan:

• Tampilkan dialog persetujuan kepada pengguna EEA/Inggris/Swiss sebelum menampilkan iklan
• Tampilkan dialog opt-out kepada pengguna di negara bagian AS yang berlaku
• Hanya minta iklan setelah persetujuan diperoleh

Yang HARUS Anda lakukan:

1. Di konsol AdMob → Privacy & messaging → Create a European regulations message
2. Di konsol AdMob → Privacy & messaging → Create a US state regulations message
3. Atur URL Kebijakan Privasi Anda di generator (Langkah 3 atau Langkah 4)
4. Pastikan kebijakan privasi Anda menyebutkan iklan AdMob

⚠️ Tanpa pengaturan ini, AdMob dapat menampilkan peringatan kebijakan: 'Consent requirement: No CMP'

Buka Privacy & messaging AdMob →

10Proses Peninjauan Iklan#

Setelah menerbitkan aplikasi Anda:

• AdMob akan meninjau aplikasi Anda (biasanya 24-48 jam)
• Awalnya, Anda akan melihat iklan uji
• Setelah disetujui, iklan sungguhan akan mulai tampil
• Jaga agar konten aplikasi Anda sesuai kebijakan

11Aktifkan Pembayaran#

Untuk menerima pendapatan iklan:

• Buka 'Payments' di dasbor AdMob
• Tambahkan metode pembayaran (rekening bank atau opsi lain)
• Verifikasi alamat Anda
• Atur informasi pajak
• Pembayaran dilakukan setiap bulan setelah mencapai ambang $100

12Praktik Terbaik#

✅ Penempatan Banner: Banner di bawah kurang mengganggu dan pengalaman pengguna lebih baik

✅ Interstisial/Rewarded: Pilih salah satu, bukan keduanya. Iklan rewarded menghasilkan lebih banyak tetapi membutuhkan keterlibatan pengguna

✅ Jumlah Tindakan: Mulai dengan 4-5 navigasi di antara iklan. Terlalu sering = ulasan buruk

✅ Uji Dahulu: Selalu uji dengan ad unit uji selama pengembangan

✅ Pantau Kinerja: Periksa dasbor AdMob secara berkala untuk pendapatan dan metrik

⚠️ Jangan Klik: Jangan pernah mengklik iklan Anda sendiri - ini melanggar kebijakan AdMob

⚠️ Konten Berkualitas: Pastikan aplikasi Anda memberi nilai dan mematuhi kebijakan AdMob

💡 Tips Pro: Gabungkan Banner (selalu terlihat) + Interstisial atau Rewarded (berkala) untuk pendapatan maksimal

13Pemecahan Masalah#

Masalah umum dan solusinya:

• Tidak ada iklan tampil: Periksa apakah Anda memakai Ad Unit ID yang benar (bukan App ID)
• Iklan uji berfungsi tetapi iklan sungguhan tidak: Tunggu peninjauan AdMob selesai
• Permintaan iklan gagal: Periksa koneksi internet dan status akun AdMob
• Akun ditangguhkan: Tinjau kebijakan AdMob dan ajukan banding jika perlu

Pusat Bantuan AdMob →

14Iklan yang dikendalikan developer: tempatkan setiap iklan sendiri#

Unduh halaman demo lengkap di bawah (Coin Runner): banner di dalam tata letak, interstisial di antara level, tombol 'Watch ad to earn 50 coins', persegi panjang 300×250, sakelar app-open, dan log langsung setiap hasil. Zip, unggah sebagai Offline ZIP, pilih Developer-controlled dengan ID uji yang sudah terisi, lalu build - setiap tombol menjelaskan dirinya sendiri.

Opsi di atas adalah mode Otomatis: aplikasi menampilkan banner dan iklan layar penuh atau rewarded untuk Anda. Jika Anda ingin semua format AdMob dan bebas menempatkan masing-masing tepat di tempat yang dibutuhkan halaman Anda, pilih 'Ad Control → Developer-controlled' di Langkah 3.

Dalam mode ini TIDAK ADA yang otomatis. Masukkan satu ad unit ID untuk setiap format yang Anda gunakan - banner, medium rectangle (300×250), interstisial, rewarded, rewarded interstitial, app-open - dan biarkan sisanya kosong. Halaman Anda kemudian mengendalikan semuanya melalui window.AppMintAds:

• AppMintAds.banner.attach('#slot', {size:'banner'|'medium_rectangle'}) - banner yang ditempatkan di atas elemen yang Anda sebut, di dalam kartu, di antara item daftar, di mana saja. Ia mengikuti elemen saat digulir; detach() menghapusnya. Hingga dua sekaligus.
• await AppMintAds.load('interstitial') → {ok:true} atau {ok:false, code:'no_fill'|'network'|'invalid_unit'|'consent'|'ad_free'|'disabled'}
• await AppMintAds.show('rewarded') → {shown:true, earned:true, reward:{type,amount}} atau {shown:false, reason}
• AppMintAds.isReady('interstitial') - aktifkan tombol Anda berdasarkan ini
• AppMintAds.appOpen.setEnabled(false) - jeda iklan app-open saat pengguna sedang mengerjakan sesuatu

AppMintAds hanya ada di dalam aplikasi yang terpasang - selalu lakukan feature-detect (if (window.AppMintAds) …) agar halaman tetap berfungsi di browser. Aturan Google tetap berlaku dan aplikasi menegakkannya: iklan rewarded hanya diputar dari ketukan pengguna sendiri (tombol 'Watch ad' Anda ADALAH persetujuannya), interstisial menjaga jeda 60 detik, dan jangan pernah menaruh iklan di atas tindakan inti.

// Feature-detect: AppMintAds exists only in the installed app
const ads = window.AppMintAds;

// 1. A banner INSIDE your layout — <div id="ad-slot"></div> reserves the space
if (ads) {
  const r = await ads.banner.attach('#ad-slot', { size: 'banner' });
  console.log(r.ok ? 'banner ' + r.width + 'x' + r.height : 'no banner: ' + r.code);
}

// 2. A full-page ad at a natural break (between levels), never on every tap
async function levelFinished() {
  if (ads && ads.isReady('interstitial')) await ads.show('interstitial');
  showNextLevel();          // continues whether or not an ad was shown
}

// 3. A 'Watch ad to earn 50 coins' button — the tap is the user's opt-in
watchBtn.onclick = async () => {
  if (!ads) return;                                 // browser: no native ads
  // From a tap the ad plays. Without one (a timer, a route change) the app shows
  // AdMob's "Watch an ad? / No thanks" intro first and answers code 'declined'.
  const r = await ads.show('rewarded');
  if (r.earned) addCoins(r.reward.amount || 50);   // grant ONLY when earned
  else if (r.reason === 'ad_free') addCoins(50);    // premium user: grant without an ad
  else toast('No ad available right now');          // no popup, no Skip button
};

// 4. Preload and keep the button honest
ads?.load('rewarded').then(r => { watchBtn.disabled = !r.ok; });

15Event status iklan: ketahui apa yang terjadi pada setiap permintaan#

Setiap iklan yang dikendalikan developer melaporkan siklus hidup lengkapnya pada SATU event, appmint:ad, sehingga Anda dapat mencatat iklan yang terisi, menanggapi kegagalan, dan menggerakkan UI Anda sendiri:

{ type, phase, slot?, code?, adCode?, message?, width?, height?, reward?, earned? }

• type: banner | mrec | interstitial | rewarded | rewarded_interstitial | app_open
• phase: loading → loaded | failed → opened → impression → clicked → closed, ditambah rewarded (hadiah diperoleh) dan show_failed
• code (saat failed): no_fill | network | invalid_unit | internal - adCode adalah nomor dari AdMob sendiri, message adalah teksnya
• slot: slot banner yang mana, untuk banner/mrec

Promise memberi jawaban yang sama per panggilan; event memberi Anda semuanya, termasuk iklan yang tidak Anda panggil lewat show() (iklan app-open, penyegaran banner). Dalam mode Automatic, AppMintAds tetap ada tetapi menjawab kode 'automatic_mode' - gunakan panggilan WebToApk.showInterstitialAd()/showRewardedAd() dan event appmint:reward / appmint:ad-closed / appmint:ad-unavailable di sana.

window.addEventListener('appmint:ad', e => {
  const a = e.detail;
  console.log(a.type, a.phase, a.code || '', a.message || '');
  if (a.phase === 'failed' && a.code === 'no_fill') analytics.track('ad_no_fill', a);
  if (a.type === 'rewarded' && a.phase === 'rewarded') console.log('earned', a.reward);
  if (a.type === 'banner' && a.phase === 'loaded') console.log('banner ' + a.width + 'x' + a.height + ' in ' + a.slot);
});

// What can this build serve? (guard it — in a browser AppMintAds is undefined)
if (window.AppMintAds) console.log(AppMintAds.config());
// → { control: 'developer', formats: { banner: true, mrec: false, interstitial: true, ... } }