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

Package Sidebar

Install

npm i use-utm-parameters

Weekly Downloads

0

Version

0.2.0

License

MIT

Unpacked Size

12.5 kB

Total Files

7

Last publish

Collaborators

  • djalmaaraujo