Logo

0x5a.live

for different kinds of informations and explorations.

GitHub - scttcper/ng2-adsense: Angular Adsense Component

Angular Adsense Component. Contribute to scttcper/ng2-adsense development by creating an account on GitHub.

Visit SiteGitHub - scttcper/ng2-adsense: Angular Adsense Component

GitHub - scttcper/ng2-adsense: Angular Adsense Component

Angular Adsense Component. Contribute to scttcper/ng2-adsense development by creating an account on GitHub.

Powered by 0x5a.live 💗

ng2-adsense NPM versioncoverage status

Easy AdSense for Angular Applications

Demo: https://ng2-adsense.xmplaylist.com/

Install

npm install ng2-adsense

Dependencies

Latest version available for each version of Angular

ng2-adsense Angular
5.4.3 5.x 6.x 7.x
6.0.3 8.x
8.0.1 9.x
9.1.0 10.x 11.x
10.1.0 12.x 13.x
11.0.0 14.x
12.0.0 15.x
13.0.0 16.x
current >=17

Use

Add adsense code

Use the standard AdSense code somewhere in your <head></head> as you normally would

<script async src=//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js></script>

Import NgModule

Add AdsenseModule to the imports of your NgModule

import { AdsenseModule } from 'ng2-adsense';

@NgModule({
  imports: [
    // shown passing global defaults (optional)
    AdsenseModule.forRoot({
      adClient: 'ca-pub-7640562161899788',
      adSlot: 7259870550,
    }),
    ...

Show Ad

Uses global defaults which can be overriden via inputs

<ng-adsense></ng-adsense>

Inputs

input type description
adClient string account ca-pub-XXXXXXXXXXXXXXXX
adSlot string/number ad slot/number
adFormat string adsense ad format
adRegion string older adsense code to make all ads on page the same
display string element display style
fullWidthResponsive boolean enable full width responsive ad
height number element height in px
width number element width in px
layout string used for in-feed ads
layoutKey string used for in-feed ads
pageLevelAds boolean enable page-level ads
adtest string sets up some sort of google test ad
className string add custom class names to the "ins" element
<ng-adsense
  [adClient]="'ca-pub-7640562161899788'"
  [adSlot]="7259870550"
  [display]="'inline-block'"
  [width]="320"
  [height]="108"
></ng-adsense>

Angular Resources

are all listed below.

Resources

listed to get explored on!!

Made with ❤️

to provide different kinds of informations and resources.