A React display ad component using Google Publisher Tag
A React component for Google Publisher Tags.
* Synchronous rendering requires that the GPT JavaScript be loaded synchronously.
$ 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.
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
adUnitPathand one of
slotSizeand
sizeMapping.
To enable Single Request Mode, call
Bling.enableSingleRequest()before rendering any ad. It defaults to
Asynchronous Rendering Modeif not set.
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.
If you pass
sizeMappingprops instead of
slotSize, React GPT listens for the viewport width change and refreshes an ad when the break point is hit.
import {Bling as GPT} from "react-gpt";class Application extends React.Component { render() { return ( ); } }
React GPTAPI
yarn
npm run examplesfor client side rendering,
npm startfor server side rendering.
Please take a moment to review the guidelines for contributing.
MIT