NgAdsense

Angular JS directive for Google AdSense advertisements.

Generate Convert Improve

Install / Use

/learn @peter-szrnka/NgAdsense

About this skill

Quality Score

0/100

README

ngAdsense

Angular JS directive for Google AdSense advertisements. With ngAdsense, you can place your ads onto your website, or an Angular JS template as well.

Build status

Requirements

A modern browser
AngularJS 1.6+

Installation

This module contains only one file (ngAdsense.js), so you have to download it from GitHub.

Now you have to do is add the scripts to your application. Just make sure the ng-adsense.min.js file is inserted after the angular.min.js script:

<script src="angular.min.js"></script>
<script src="ng-adsense.min.js"></script>

Bower

bower install ngAdsense --save

Usage

Add the ngAdsense module as a dependency in your AngularJS app;
Add the custom directive <adsense-directive> to your html page or template.
Setup all three mandatory fields.
Ready!

Important: This solution cannot be tested on local developer environment!

Example

<html>
	<head>
	  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	  <meta name="viewport" content="width=device-width, initial-scale=1">
	  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
	  <script type="text/javascript" src="ng-adsense.min.js"></script>
	  <script type="text/javascript">
	    var ngAdSenseDemoApp = angular.module('DemoApp', ['ngAdsense']);
	  </script>
	</head>
	<body ng-app="DemoApp">
	  <adsense-directive 
	    ad-client="YOUR_CLIENT_ID"
	    ad-slot="YOUR_SLOT_ID" 
	    ad-format="auto"
	    css-style="display:inline-block;width:320px;height:50px;">
	  </adsense-directive>
	</body>
</html>

License

See the LICENSE file.

Changelog

See the CHANGELOG file.

Related Skills

node-connect

348.2k

Diagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps

frontend-design

108.9k

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

openai-whisper-api

348.2k

Transcribe audio via OpenAI Audio Transcriptions API (Whisper).

qqbot-media

348.2k

QQBot 富媒体收发能力。使用 <qqmedia> 标签，系统根据文件扩展名自动识别类型（图片/语音/视频/文件）。