Skip to main content

Creating a Plugin

In its very basic form, a Faust Plugin is a JavaScript class with an apply method. This apply method has a parameter called hooks, which is passed from @wordpress/hooks. Here is an implementation in TypeScript:

MyPlugin.tsx
import { FaustHooks, FaustPlugin } from '@faustwp/core';

export class MyPlugin implements FaustPlugin {
apply(hooks: FaustHooks) {}
}

The hooks parameter is an object which contains the functions addFilter and addAction, amongst others. You can then use these functions to call the respective actions and filters to tap into Faust:

MyPlugin.tsx
import { FaustHooks, FaustPlugin } from '@faustwp/core';

export class MyPlugin implements FaustPlugin {
apply(hooks: FaustHooks) {
const { addAction, addFilter } = hooks;

addFilter(
'possibleTemplatesList',
'my-namespace',
(possibleTemplates, context) => {
// Filter logic goes here.
},
);
}
}

You or the end user can then implement the plugin by adding it to the experimentalPlugins property in the App's faust.config.js file:

import { setConfig } from '@faustwp/core';
import templates from './wp-templates';
import possibleTypes from './possibleTypes.json';
import { MyPlugin } from './MyPlugin.tsx';

/**
* @type {import('@faustwp/core').FaustConfig}
**/
export default setConfig({
templates,
experimentalPlugins: [new MyPlugin()],
possibleTypes,
});