[go: up one dir, main page]

use-utm-parameters
TypeScript icon, indicating that this package has built-in type declarations

0.2.0 • Public • Published

useUTMParameters() Hook

Get all valid UTM params from a string.

What is UTM Code?

A UTM (Urchin Tracking Module) code is a snippet of text added to the end of a URL to track the metrics and performance of a specific digital marketing campaign. UTM codes can contain up to five parameters: Campaign, source, medium, content, and term. Reference.

Install

npm install use-utm-parameters

Usage

import { useUTMParameters } from "use-utm-parameters";

// Common usage
const params = useUTMParameters(
  "?utm_source=xxxx&utm_campaign=2024_show&utm_term=what"
);

//=> { "utm_term": "what", "utm_source": "xxxx", "utm_campaign": "2024_show" }

const params = useUTMParameters(
  "?utm_source=xxxx&utm_campaign=2024_show&utm_term=what",
  {
    format: "short", // Removes the UTM prefix from keys
  }
);

//=> { "term": "what", "source": "xxxx", "campaign": "2024_show" }

const params = useUTMParameters("?utm_campaign=2024_show&utm_term=what", {
  format: "short",
});

//=> { "term": "what", "campaign": "2024_show" }

const params = useUTMParameters("");
//=> {}

const params = useUTMParameters();
//=> {}

[!NOTE] This library will not grab the query params from the URL. You can use window.location.search or any other method.

API

useUTMParameters(value, options)

  • value: A URL-like string containing the utm parameters.
  • options: An objecting containing one or more of the following keys:
Option Type Description
format String short OR default. short will remove the utm prefix from keys. See examples above

Dependencies (0)

    Dev Dependencies (3)

    Package Sidebar

    Install

    npm i use-utm-parameters

    Weekly Downloads

    2

    Version

    0.2.0

    License

    MIT

    Unpacked Size

    12.5 kB

    Total Files

    7

    Last publish

    Collaborators

    • djalmaaraujo