How to Create 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) {}
}
Code language: JavaScript (javascript)
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.
},
);
}
}
Code language: JavaScript (javascript)
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:
// faust.config.js
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,
});
Code language: JavaScript (javascript)