1.0.0 • Published 4 years ago

react-reddit-pixel v1.0.0

Weekly downloads
5
License
MIT
Repository
github
Last release
4 years ago

React Reddit Pixel

npm

React JS wrapper for Reddit's Pixel

Based on react-facebook-pixel by Zain Sajjad, adapted to Reddit's pixel.

Install

npm install react-reddit-pixel

or

yarn add react-reddit-pixel

How to use

import RedditPixel from "react-reddit-pixel";

const options = {
  debug: false, // set true to enable logs
};
RedditPixel.init("yourRedditAdvertiserIDGoesHere", options);

RedditPixel.pageVisit(); // For tracking page visit
RedditPixel.track(event); // For tracking standard events, see https://advertising.reddithelp.com/en/categories/managing-ads/implementing-reddit-pixel#N1
RedditPixel.track("Search");
RedditPixel.rdt(...args); // For tracking custom events, though Reddit currently doesn't list support for this in their documentation

if you're bundling in CI

  ...
  componentDidMount() {
    const RedditPixel =  require('react-reddit-pixel');
    RedditPixel.init('yourPixelIdGoesHere');
  }
  ...

otherwise CI will complain there's no window.

Standard Event Types

See the full list here: Event Types;

Event NameDescriptionCode
PageVisitDefault event in the conversion pixel that will track that the user has visited one of the advertiser’s pageRedditPixel.pageVisit();
ViewContentUser view a particular content on a pageRedditPixel.track("ViewContent");
SearchUser performed a search queryRedditPixel.track("Search");
AddToCartUser added a product to the shopping cartRedditPixel.track("AddToCart");
AddToWishlistUser added a product to wishlistRedditPixel.track("AddToWishlist");
PurchaseUser completed the purchaseRedditPixel.track("Purchase");
LeadWhen user submits information expressing interest in the advertised product/offerRedditPixel.track("Lead");
SignUpUser completed registration form or sign upfor a new serviceRedditPixel.track("SignUp");

:warning: Note: Event names are case-sensitive! :warning:

Disable first-party cookies

  ...
  RedditPixel.disableFirstPartyCookies(); // Do this before tracking any events
  RedditPixel.pageVisit();
  ...

Dev Server

npm run start

Default dev server runs at localhost:8080 in browser. You can set IP and PORT in webpack.config.dev.js

Production Bundle

npm run bundle

Follow me on Twitter: @guamhat

reactreactjsreact-componentpixelreddit-pixelreddit
@everything-registry/sub-chunk-2606
1.0.0

4 years ago