URL Parameters
Add parameters to URLs
About
This is a PostHTML plugin that allows you to add parameters to URLs.
Install
$ npm i posthtml posthtml-url-parameters
Usage
const posthtml = require('posthtml')
const urlParams = require('posthtml-url-parameters')
posthtml([
urlParams({
parameters: { foo: 'bar', baz: 'qux' }
})
])
.process('<a href="https://example.com">Test</div>')
.then(result => console.log(result.html)))
// <a href="https://example.com?baz=qux&foo=bar">Test</div>Configuration
parameters
Default: undefined
Object containing parameter name (key) and its value.
Example:
require('posthtml-url-parameters')({
parameters: {
utm_source: 'Campaign',
'1stDraft': true
}
})tags
Default: [a]
Array of tag names to process.
By default, only URLs inside href="" attributes of tags in this array will be processed.
Example:
require('posthtml-url-parameters')({
tags: ['a', 'link'],
// ...
})You may use some CSS selectors when specifying tags:
require('posthtml-url-parameters')({
tags: ['a.button', 'a[href*="example.com"]' 'link'],
// ...
})All posthtml-match-helper selectors are supported.
strict
Default: false
By default, the plugin will append query parameters only to valid URLs.
You may disable strict mode to append parameters to any string:
const posthtml = require('posthtml')
const urlParams = require('posthtml-url-parameters')
posthtml([
urlParams({
parameters: { foo: 'bar' },
strict: false,
})
])
.process('<a href="https://example.com/campaigns/{{ id }}">Details</div>')
.then(result => console.log(result.html)))
// <a href="https://example.com/campaigns/{{ id }}?foo=bar">Details</div>qs
Default: undefined
Options to pass to query-string - see available options here.
For example, you may disable encoding:
const posthtml = require('posthtml')
const urlParams = require('posthtml-url-parameters')
posthtml([
urlParams({
parameters: { foo: '@Bar@' },
qs: {
encode: false
}
})
])
.process('<a href="https://example.com">Test</div>')
.then(result => console.log(result.html)))
// <a href="https://example.com?foo=@Bar@">Test</div>