Semantic DoubleClick for Publishers (DFP by Google) integration with AngularJS.
<dfp-ad force-safe-frame collapse-if-empty ad-unit="/path/to/my/ad-unit"> <dfp-size width="728" height="90"></dfp-size> </dfp-ad>
What does it solve?
This library solves two problems:
- You can define your ad slots using only HTML, which is just plain sweet.
- It solves problems that are sometimes encountered with GPT and Single-Page-Applications (SPAs) by giving you manual control over when to fetch and refresh ads (typically on page redirects within Angular).
We have defined (nested) directives that effectively cover all the functionality of the GPT library.
Simple Fixed Size Ad
In the simplest case, you'll simply want to define an ad with a fixed size. In
that case, you would have a
dfp-ad directive, which requires at least one
dfp-size directive. The
dfp-ad directive additionally takes some
optional attributes, such as the
collapseEmptyDiv option you may be familiar
with from the GPT library. For all options, refer to the documentation, which
can be generated from jsdoc with
<dfp-ad force-safe-frame collapse-if-empty refresh='3s' ad-unit="/path/to/my/ad-unit"> <dfp-size width="728" height="90"></dfp-size> </dfp-ad>
A live demo can be found at angular-dfp-demo.appspot.com.
This project is released under the Apache License. For more information, see the LICENSE file.