Skip to main content
WebView Ads use Google AdSense and require special setup. This feature integrates AdSense ads into your Cordova WebView app.
WebView Ads allow you to monetize your Cordova app using Google AdSense instead of traditional AdMob ads. This is useful for apps that display web content.

Installation

In addition to admob-plus-cordova, install the WebView Ad plugin:
cordova plugin add admob-plus-cordova-webview-ad

Setup Requirements

WebView Ads require:
  • Google AdSense account
  • AdSense publisher ID (ca-pub-xxxxx)
  • WebView configured for ads
WebView Ads are only supported on Android and iOS platforms with properly configured WebView.

WebViewAdOptions

adsense
string
required
Your AdSense publisher ID (e.g., “ca-pub-1234567890123456”)
src
string
Custom AdSense script URL. Defaults to the standard AdSense script.
npa
'1' | undefined
Set to “1” to request non-personalized ads for GDPR compliance.

Methods

checkIntegration()

Static method to verify WebView integration:
await WebViewAd.checkIntegration();
This navigates to a test page to verify that the WebView is properly configured.

addAd()

Add an ad to a specific element:
element
HTMLElement
required
The HTML element where the ad will be inserted
slot
string
required
Your AdSense ad slot ID
format
string
Ad format (default: “auto”)
fullWidth
boolean
Enable full-width responsive ads (default: true)
html
string
Custom HTML for the ad unit. If provided, overrides other options.

Usage Examples

Basic WebView Ad

import { WebViewAd } from 'admob-plus-cordova';

// Initialize WebView Ad
const webviewAd = new WebViewAd({
  adsense: 'ca-pub-1234567890123456',
});

// Add an ad to an element
const adContainer = document.getElementById('ad-container');
webviewAd.addAd({
  element: adContainer,
  slot: '1234567890',
  format: 'auto',
  fullWidth: true,
});

Non-Personalized Ads

For GDPR compliance, request non-personalized ads:
const webviewAd = new WebViewAd({
  adsense: 'ca-pub-1234567890123456',
  npa: '1', // Request non-personalized ads
});

Multiple Ads

Add multiple ad units to different elements:
const webviewAd = new WebViewAd({
  adsense: 'ca-pub-1234567890123456',
});

// Header ad
webviewAd.addAd({
  element: document.getElementById('header-ad'),
  slot: '1111111111',
  format: 'horizontal',
});

// Sidebar ad
webviewAd.addAd({
  element: document.getElementById('sidebar-ad'),
  slot: '2222222222',
  format: 'rectangle',
});

// Footer ad
webviewAd.addAd({
  element: document.getElementById('footer-ad'),
  slot: '3333333333',
  format: 'auto',
});

Custom HTML

Provide custom AdSense HTML:
const customHtml = `
  <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  <ins class="adsbygoogle"
       style="display:block"
       data-ad-client="ca-pub-1234567890123456"
       data-ad-slot="1234567890"
       data-ad-format="auto"></ins>
  <script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
`;

webviewAd.addAd({
  element: document.getElementById('custom-ad'),
  slot: '', // Not used with custom HTML
  html: customHtml,
});

Verify Integration

Before using WebView Ads in production, verify your setup:
try {
  await WebViewAd.checkIntegration();
  console.log('WebView integration successful');
} catch (error) {
  console.error('WebView integration failed:', error);
}

Lifecycle Behavior

WebView Ads automatically handle app pause/resume:
  • On Pause: Preserves the current URL state
  • On Resume: Restores the original URL state
This ensures ads continue to function correctly when the app is backgrounded and resumed.

Best Practices

Verify WebView integration before deploying to production
Use appropriate ad formats for different screen sections
Request non-personalized ads (npa: ‘1’) for users in GDPR regions
Test ads thoroughly in both Android and iOS WebView
Follow AdSense policies and placement guidelines

Limitations

  • WebView Ads require a properly configured WebView with AdSense support
  • Not all Cordova WebView implementations support WebView Ads
  • Browser platform is not supported
  • Revenue and analytics are managed through AdSense, not AdMob

Troubleshooting

  1. Verify your AdSense publisher ID is correct
  2. Check that ad slots are valid and approved
  3. Run WebViewAd.checkIntegration() to verify setup
  4. Ensure the WebView supports AdSense (check console for errors)
The WebView may not be properly configured. Ensure:
  • admob-plus-cordova-webview-ad plugin is installed
  • Platform is Android or iOS (not browser)
  • WebView has necessary ad support capabilities
WebView Ads use AdSense for revenue tracking, not AdMob:
  • Check your AdSense dashboard for reports
  • Verify ads are approved and serving
  • Ensure ad placements comply with AdSense policies

See Also

Build docs developers (and LLMs) love