Skip to main content
Community Plugin
View plugin on GitHub
See starters using this


A Gatsby plugin to easily add Dito JS snippet to your site.


  • NPM: $ yarn add gatsby-plugin-dito
  • YARN: $ npm install --save gatsby-plugin-dito

How to use


In your gatsby-config.js file:

plugins: [
        resolve: `gatsby-plugin-dito`,
        options: {
            // your dito api key
            // required; non-empty string
            apiKey: `DITO_API_KEY`

Track Events

If you want to track events, you simply invoke Dito as normal — (window.dito.track({...}) — and you should see the events within your Dito Dashboard! For example, if you wanted to track events on a click, it may look something like this:

class IndexPage extends React.Component {
    _handleClick() {
            action: 'track-action-name',
            data: {
              gender: 'male',
              age: 33
    render() {
        return (
                <Link onClick={this._handleClick} to="/">
                    Click here
                </Link>{" "}
                to see a track event