React GPT

A React component for Google Publisher Tags.

Requirements

• React 0.14+

Browser Requirements

• IE10+

Features

• Supports all rendering modes (single request mode, async rendering node and *sync rendering mode)
• Supports responsive ads.
• Supports interstitial ads.
• Supports lazy render.

* Synchronous rendering requires that the GPT JavaScript be loaded synchronously.

Installation

$ yarn react-gpt

React GPT depends on Promise to be available in browser. If your application support the browser which doesn't support Promise, please include the polyfill.

Getting Started

Import React GPT and pass props to the component.

import {Bling as GPT} from "react-gpt";

class Application extends React.Component {
    render() {
        return (
            
        );
    }
}

You at least need to pass

adUnitPath

slotSize

sizeMapping

Enabling Single Request Mode

To enable Single Request Mode, call

Bling.enableSingleRequest()

Asynchronous Rendering Mode

import {Bling as GPT} from "react-gpt";

GPT.enableSingleRequest();
class Application extends React.Component {
    render() {
        return (
            

                
            
            

                
            
        );
    }
}

The above example will make one request to the server to render both ads which makes it easier to ensure category exclusion.

Responsive ad

If you pass

sizeMapping

slotSize

import {Bling as GPT} from "react-gpt";

class Application extends React.Component {
    render() {
        return (
            
        );
    }
}

API and Documentation

• API Review the

  React GPT

  API
• Getting Started A more detailed Getting Started Guide
• Docs Guides and API.

To run examples:

1. Clone this repo
2. Run

   yarn

3. Run

   npm run examples

   for client side rendering,

   npm start

   for server side rendering.
4. Point your browser to http://localhost:8080

Contributing to this project

Please take a moment to review the guidelines for contributing.

• Pull requests
• Development Process

License

MIT