[DEMO]https://codesandbox.io/s/elated-sammet-wnps7g?file=/src/index.js)
<link href="https://unpkg.com/grapesjs/dist/css/grapes.min.css" rel="stylesheet"> <script src="https://unpkg.com/grapesjs"></script> <script src="https://unpkg.com/grapesjs-user-blocks"></script> <div id="gjs"></div>
const editor = grapesjs.init({ container: '#gjs', height: '100%', fromElement: true, storageManager: false, plugins: ['grapesjs-user-blocks'], });
body, html { margin: 0; height: 100%; }
grapesjs-user-blocks
super simple user block generator for grapesjs. it allow developers to store there components in Storage Manager and also in blockManager to use letter.https://unpkg.com/grapesjs-user-blocks
npm i grapesjs-user-blocks
git clone https://github.com/gxnanshu/grapesjs-user-blocks.git
Directly in the browser
<link href="https://unpkg.com/grapesjs/dist/css/grapes.min.css" rel="stylesheet"/> <script src="https://unpkg.com/grapesjs"></script> <script src="path/to/grapesjs-user-blocks.min.js"></script> <div id="gjs"></div> <script type="text/javascript"> var editor = grapesjs.init({ container: '#gjs', // ... plugins: ['grapesjs-user-blocks'] }); </script>
Modern javascript
import grapesjs from 'grapesjs'; import plugin from 'grapesjs-user-blocks'; const editor = grapesjs.init({ container : '#gjs', // ... plugins: [plugin], // pluginsOpts: { // [plugin]: { /* options */ } // } // // or // plugins: [ // editor => plugin(editor, { /* options */ }), // ], });
Clone the repository
$ git clone https://github.com/gxnanshu/grapesjs-user-blocks.git $ cd grapesjs-user-blocks
Install dependencies
Start the dev server
Build the source
MIT
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4