You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
<linkhref="https://unpkg.com/grapesjs/dist/css/grapes.min.css" rel="stylesheet"/><scriptsrc="https://unpkg.com/grapesjs"></script><scriptsrc="path/to/grapesjs-style-filter.min.js"></script><divid="gjs"></div><scripttype="text/javascript">consteditor=grapesjs.init({container : '#gjs',// ...plugins: ['grapesjs-style-filter'],// Use the property on initstyleManager: {sectors: [// ...{id: 'extra',name: 'Extra',properties: [{extend: 'filter'},{extend: 'filter',property: 'backdrop-filter'},],}]},});// or add it to the StyleManager via APIeditor.StyleManager.addProperty('extra',{extend: 'filter'});editor.StyleManager.addProperty('extra',{extend: 'filter',property: 'backdrop-filter'});</script>
Modern javascript
importgrapesjsfrom'grapesjs';importstyleFilterfrom'grapesjs-style-filter';consteditor=grapesjs.init({container : '#gjs',plugins: [styleFilter,/*...*/],// Same StyleManager configuration});// Same StyleManager API usage
Development
Clone the repository
$ git clone https://github.com/GrapesJS/style-filter.git
$ cd grapesjs-style-filter
Install dependencies
$ npm i
Start the dev server
$ npm start
License
BSD 3-Clause
About
Add filter type input to the Style Manager in GrapesJS