A number of tags and filters can be encapsulated into a plugin, which will be typically installed via npm. This article provides information about how to create and use a plugin.
Write a Plugin
A liquidjs plugin is simple function which takes the Liquid class as the first parameter and the Liquid instance for this
. We can call liquidjs APIs on this
to make certain changes, especially register filters and tags.
Now we’ll make a plugin to upper case every letter of the input, save the following snippet to upup.js
:
/**
* Inside the plugin function, `this` refers to the Liquid instance.
*
* @param Liquid: provides facilities to implement tags and filters.
*/
module.exports = function (Liquid) {
this.registerFilter('upup', x => x.toUpperCase());
}
Use a Plugin
Simply pass the plugin function into the .plugin()
method:
const engine = new Liquid()
engine.plugin(require('./upup.js'));
engine
.parseAndRender('{{ "foo" | upup }}')
.then(console.log) // outputs "FOO"
Plugin List
Since this library excludes certain features that are available on the Shopify platform but not on the Shopify/liquid repo, see Differences with Shopify/liquid.
Here’s a list of plugins that backfill those features. Feel free to add yours, this file is publicly editable.
- Sections Tags (WIP): https://github.com/harttle/liquidjs-section-tags
- Color Filters: https://github.com/harttle/liquidjs-color-filters