Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
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 (8 months ago)
- Last Synced: 2024-11-06T10:07:35.734Z (about 1 month ago)
- Topics: adsense, angular, ngmodule, typescript
- Language: TypeScript
- Homepage: https://ng2-adsense.xmplaylist.com
- Size: 4.95 MB
- Stars: 138
- Watchers: 8
- Forks: 24
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-angular - ng2-adsense - Angular Adsense Component. (Table of contents / Angular)
- fucking-awesome-angular - ng2-adsense - Angular Adsense Component. (Table of contents / Angular)
- fucking-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
```