@frontity/google-analytics

    2.1.0 • Public • Published

    @frontity/google-analytics

    Version npm License: Apache--2.0

    Analytics package to use Google Analytics with Frontity

    Install

    npm i @frontity/google-analytics

    Settings

    The namespace for this package is googleAnalytics

    Every Google Analytics account has a Tracking ID. To connect the package with a specific account (or accounts) we can set the following properties in the frontity.settings.js:

    • state.googleAnalytics.trackingId: to specify just one tracking ID
    • state.googleAnalytics.trackingIds: to specify a list of tracking ID's
    export default {
      packages: [
        {
          name: "@frontity/google-analytics",
          state: {
            googleAnalytics: {
              trackingId: "UA-12345678-9",
            },
          },
        },
      ],
    };
    export default {
      packages: [
        {
          name: "@frontity/google-analytics",
          state: {
            googleAnalytics: {
              trackingIds: ["UA-34567890-12", "UA-34567890-13"],
            },
          },
        },
      ],
    };

    Usage

    This @frontity/google-analytics package can co-exist with some other analytics packages. Once we have properly installed and configured these analytics packages, their actions will be centralized by the analytics namespace

    • actions.analytics.pageview() will take into account settings in state.analytics.pageviews
    • actions.analytics.event() will take into account settings in state.analytics.events

    Read More info about how to use Analytic packages in the docs

    actions.analytics.pageview

    If @frontity/google-analytics is configured and enabled for pageviews in state.analytics.pageviews, every time a link changes (or every time action.router.set(link) is launched) a tracking for that page will be sent to Google Analytics by using internally actions.analytics.pageview()

    actions.analytics.event

    If @frontity/google-analytics is configured and enabled for events in state.analytics.events, every time you call the method actions.analytics.event() from any of your React components, the proper tracking info will be sent to Google Analytics.

    The actions.analytics.event() must receive an event object with the following properties.

    Name Type Default Required Description
    name string - true The value of this property is mapped to the eventAction field of analytics.js events.
    payload Object - true Event payload.

    The payload object has to have the following format:

    Name Type Default Required Description
    category string - true The value of this property is mapped to the eventCategory field of analytics.js events.
    label string - false The value of this property is mapped to the eventLabel field of analytics.js events.
    value number - false The value of this property is mapped to the eventValue field of analytics.js events.
    [key] any - false Any other property specified in analytics.js field reference.

    These values will be transfomed (by this package) into the proper format before sending the data to Google Analytics


    Feature Discussions

    Feature Discussions about Frontity are public. You can join the discussions, vote for those you're interested in or create new ones.

    These are the ones related to this package: https://community.frontity.org/tags/c/feature-discussions/33/google-analytics

    Changelog

    Have a look at the latest updates of this package in the CHANGELOG


    » Open Source Community

    Community Forum Topics Twitter: frontity Frontity Github Stars

    Frontity has a number of different channels at your disposal where you can find out more information about the project, join in discussions about it, and also get involved:

    • 📖 Docs: our primary documentation resource - this is the place to learn how to build amazing sites with Frontity.
    • 👨‍👩‍👧‍👦 Community forum: join Frontity's forum and ask questions, share your knowledge, give feedback and meet other cool Frontity people. We'd also love to know about what you're building with Frontity, so please do swing by the forum and tell us about your projects.
    • 🐞 Contribute: Frontity uses GitHub for bugs and pull requests. See our Contributing section to find out how you can help develop Frontity, or improve this documentation.
    • 🗣 Social media: interact with other Frontity users. Reach out to the Frontity team on Twitter. Mention us in your tweets about Frontity and what you're building by using @frontity.
    • 💌 Newsletter: do you want to receive the latest news about Frontity and find out as soon as there's an update to the framework? Subscribe to our newsletter.

    » Get involved 🤗

    GitHub issues by-label

    Got questions or feedback about Frontity? We'd love to hear from you in our community forum.

    Frontity also welcomes contributions. There are many ways to support the project! If you don't know where to start then this guide might help: How to contribute?.

    If you would like to start contributing to the code please open a pull request to address one of our good first issues.

    Install

    npm i @frontity/google-analytics

    DownloadsWeekly Downloads

    99

    Version

    2.1.0

    License

    Apache-2.0

    Unpacked Size

    37.1 kB

    Total Files

    8

    Last publish

    Collaborators

    • davidarenas
    • frontibotito
    • luisherranz
    • poliuk
    • santosguillamot