If you like my work, please consider supporting its development.

The script partial is used to generate a <script> tag that includes an external javascript file on a page. It is compatible with files from CDNs, static files, and script assets.

Usage

The script partial takes a dict as its context argument, with the following possible keys:

KeyDescriptionExample
Asset

Specifies a path relative to the assets/ directory where a JavaScript file can be used as a resource. It or Src must be present.

"js/my-shortcode.js"
Src

Specifies a path relative to the static/ directory or an absolute URL to where a JavaScript file is located. It or Asset must be present.

https://cdn.example.com/resource.js or /path/to/static-file.js

Tracks

Whether the JavaScript file tracks the user, via cookies or otherwise. This includes authentication/session cookies. Used with Iubenda integration to ensure consent is received before tracking a user. Defaults to false.

true
CrossOrigin

Set the crossorigin attribute on the <script> tag. CDNs may require it to be set to "anonymous" for CORS requests.

"anonymous"
Integrity

Set the integrity attribute on the <link> tag to prevent maliciously modified files from loading. Only for stylesheets included with Src - those using Asset generate this value.

sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ
AttrsAny other attributes that may not be covered by the above options.nomodule
Defer

Whether the defer attribute should be set on the script to hold parsing of the script until the page has been parsed. Deferred files execute in the order they appear in the page. Defaults to true.

true
Async

Whether the async attribute should be set on the script so that it is loaded and parsed asynchronously. Asynchronous scripts may run before their dependencies, if they download before the dependency. Defaults to false

true
Root

Must be set to the top-level context ($) so the partial can access site variables via .Root.Site.Params.

$

Examples

Below, you can find examples using the styles partial with Asset and with Src. The call to styles can be long, so the lines have been broken up to better fit on the page without causing too much horizontal scrolling.

{{ partial "script" (dict "Asset" "js/shortcodes/katex.js" "Defer" true "Root" $) }}
{{ partial "script" (dict "Src" "https://cdn.jsdelivr.net/npm/katex@0.10.0-beta/dist/katex.min.js"
"Integrity" "sha384-U8Vrjwb8fuHMt6ewaCy8uqeUXv4oitYACKdB0VziCerzt011iQ/0TqlSlv8MReCm"
"CrossOrigin" "anonymous" "Defer" true "Root" $) }}