https://github.com/formspark/formtrack
Automatically inject UTM parameters into your HTML form submissions
https://github.com/formspark/formtrack
form forms tracking utm
Last synced: about 1 year ago
JSON representation
Automatically inject UTM parameters into your HTML form submissions
- Host: GitHub
- URL: https://github.com/formspark/formtrack
- Owner: formspark
- License: mit
- Created: 2020-12-26T15:43:18.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2023-11-02T13:37:05.000Z (over 2 years ago)
- Last Synced: 2025-04-08T13:18:23.555Z (about 1 year ago)
- Topics: form, forms, tracking, utm
- Language: TypeScript
- Homepage:
- Size: 633 KB
- Stars: 3
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Formtrack
Automatically inject UTM parameters into your HTML form submissions.
Sponsored by Formspark, the simple & powerful form solution for developers.
[](https://github.com/formspark/formtrack/actions?query=workflow%3A%22Continuous+deployment%22)
## About
Marketers use UTM parameters to track the effectiveness of online campaigns across traffic sources and publishing media.
The parameters identify the campaign that refers traffic to a specific website and can be parsed by analytics tools and used to populate reports.
Copying these parameters and injecting them into your form submissions manually is tedious and error-prone, we built Formtrack to automate this process.
## Installation & usage
Add the Formtrack script.
```html
```
Add a `data-formtrack` attribute to your form element.
```html
Send
```
Formtrack will now automatically inject the supported parameters into your HTML form submissions.
## Supported parameters
| Parameter | Purpose | Example |
| ------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- |
| ref | Identifies which site sent the traffic, not an official parameter. | ref=producthunt |
| referrer | Identifies which site sent the traffic, not an official parameter. | referrer=producthunt |
| utm_source | Identifies which site sent the traffic, and is a required parameter. | utm_source=google |
| utm_medium | Identifies what type of link was used, such as cost per click or email. | utm_medium=cpc |
| utm_campaign | Identifies a specific product promotion or strategic campaign. | utm_campaign=spring_sale |
| utm_term | Identifies search terms. | utm_term=running+shoes |
| utm_content | Identifies what specifically was clicked to bring the user to the site, such as a banner ad or a text link. It is often used for A/B testing and content-targeted ads. | utm_content=logolink or utm_content=textlink |
## Custom parameters
You have the flexibility to define a list of custom parameters.
Include a `data-formtrack-params` attribute within your form element, and populate it with a comma-separated list of the desired parameters.
```html
...
```
## License
[MIT](https://opensource.org/licenses/MIT)