Divi Builder Javascript Hooks
Learn about the Javascript hooks that are available in Divi Builder features.
Layout
{module_type}.css.selector
Filters module selector on the rendered layout. This filter is fired before selector processing. Third-party extensions may use this filter to modify module CSS selector such as removing builder selector prefix, append child element class, etc.
Type: Filter
Since: 4.0.0
| Param | Type | Description |
|---|---|---|
| selector | string |
Module selector. |
| type | string |
Module slug. |
Examples:
/**
* Filters Hello World module selector after builder content is loaded.
*/
document.addEventListener('ETDOMContentLoaded', function() {
// Module type: smpl_hello_world.
wp.hooks.addFilter('smpl.hello.world.css.selector', 'smpl-setting-update', function(selector){
// Processing Hello World module selector here ...
return selector;
});
});
{module_type}.processed.css.selector
Filters processed module selector on the rendered layout. This filter is fired after selector processing. Third-party extensions may use this filter to modify module CSS selector such as removing builder selector prefix, append child element class, etc.
Type: Filter
Since: 4.17.6
| Param | Type | Description |
|---|---|---|
| selector | string |
Processed module selector. |
| type | string |
Module slug. |
Examples:
/**
* Filters Hello World module selector after builder content is loaded.
*/
document.addEventListener('ETDOMContentLoaded', function() {
// Module type: smpl_hello_world.
wp.hooks.addFilter('smpl.hello.world.processed.css.selector', 'smpl-setting-update', function(selector){
// Processing Hello World module selector here ...
return selector;
});
});