ASW Google Adsense

Show google ads for Angular application with latest version of Angular.

Installation

npm install @asoftwareworld/google-adsense

Add google adsense code

Use the standard AdSense code in your index.html file under <head></head> as you normally would

//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js

Import NgModule

And then include it in your module (see app.module.ts ):

import { GoogleAdsenseModule } from '@asoftwareworld/google-adsense';
// ...

@NgModule({
  imports: [
    // shown passing global defaults (optional)
    GoogleAdsenseModule.forRoot({
      adClient: 'ca-pub-9010581920864857',
      adSlot: 1795662914,
    }),
    ...
  ]
  // ...
})
export class AppModule {}

Show Ad

Uses global defaults which can be overriden via inputs

<asw-google-adsense
  [adClient]="'ca-pub-9010581920864857'"
  [adSlot]="1795662914"
  [display]="'inline-block'"
  [width]="320"
  [height]="108"
></asw-google-adsense>

Inputs

inputtypedescription
adClientstringaccount ca-pub-XXXXXXXXXXXXXXXX
adSlotstring/numberad slot/number
adFormatstringadsense ad format
adRegionstringolder adsense code to make all ads on page the same
displaystringelement display style
heightnumberelement height in px
widthnumberelement width in px
layoutstringused for in-feed ads
layoutKeystringused for in-feed ads
pageLevelAdsbooleanenable page-level ads
timeOutRetrybooleanon first load sometimes adsense is not ready. retry’s push after x ms
adteststringsets up some sort of google test ad
classNamestringadd custom class names to the “asw” element

License

MIT License.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s