https://github.com/scttcper/ng2-adsense

Angular Adsense Component
https://github.com/scttcper/ng2-adsense

adsense angular ngmodule typescript

Last synced: about 1 month ago
JSON representation

Angular Adsense Component

• Host: GitHub
• URL: https://github.com/scttcper/ng2-adsense
• Owner: scttcper
• License: mit
• Created: 2016-09-15T06:21:27.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2024-04-18T03:20:14.000Z (5 months ago)
• Last Synced: 2024-07-19T02:33:19.129Z (about 2 months ago)
• Topics: adsense, angular, ngmodule, typescript
• Language: TypeScript
• Homepage: https://ng2-adsense.xmplaylist.com
• Size: 4.95 MB
• Stars: 136
• Watchers: 8
• Forks: 24
• Open Issues: 10
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-angular - ng2-adsense - Angular Adsense Component. (Table of contents / Angular)

README

        
# ng2-adsense [![NPM version][npm-image]][npm-url][![coverage status][coverage-img]][coverage-url]

[npm-image]: https://img.shields.io/npm/v/ng2-adsense.svg

[npm-url]: https://npmjs.org/package/ng2-adsense

[coverage-img]: https://codecov.io/gh/scttcper/ng2-adsense/branch/master/graph/badge.svg

[coverage-url]: https://codecov.io/gh/scttcper/ng2-adsense

> 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 `` as you [normally would](https://support.google.com/adsense/answer/7477845)

```html

```

#### Import NgModule

Add AdsenseModule to the imports of your NgModule

```typescript

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

```html

```

## 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         |

```html

```