Skip to content

Commit

Permalink
Update README
Browse files Browse the repository at this point in the history
  • Loading branch information
artf committed Aug 29, 2022
1 parent 77623ac commit 73df2d3
Showing 1 changed file with 32 additions and 13 deletions.
45 changes: 32 additions & 13 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,6 @@ Simple countdown component for GrapesJS Editor
* Blocks: `countdown`


* Switched the plugin name from `gjs-component-countdown` to `grapesjs-component-countdown`
* Added `id`
* Removed `blocks` and `labelCountdownCategory` options in favor of `block`.
* Removed `defaultStyle` options in favor of `style`.
* Removed `labelCountdown` options in favor of `label`.
* Removed `countdownClsPfx` options in favor of `classPrefix`.


## Options

| Option | Description | Default |
Expand All @@ -51,32 +43,59 @@ Simple countdown component for GrapesJS Editor

## Download

* `npm i grapesjs-component-countdown` or `yarn add grapesjs-component-countdown`
* CDN
* `https://unpkg.com/grapesjs-component-countdown`
* NPM
* `npm i grapesjs-component-countdown`
* GIT
* `git clone https://github.com/artf/grapesjs-component-countdown.git`






## Usage

Directly in the browser
```html
<link href="path/to/grapes.min.css" rel="stylesheet"/>
<script src="path/to/grapes.min.js"></script>
<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-component-countdown.min.js"></script>

<div id="gjs"></div>

<script type="text/javascript">
var editor = grapesjs.init({
container : '#gjs',
plugins: ['gjs-component-countdown'],
// ...
plugins: ['grapesjs-component-countdown'],
pluginsOpts: {
'gjs-component-countdown': {/* ...options */}
'grapesjs-component-countdown': { /* options */ }
}
});
</script>
```

Modern javascript
```js
import grapesjs from 'grapesjs';
import pluginCountdown from 'grapesjs-component-countdown';

const editor = grapesjs.init({
container : '#gjs',
// ...
plugins: [pluginCountdown],
pluginsOpts: {
[pluginCountdown]: { /* options */ }
}
// or
plugins: [
editor => pluginCountdown(editor, { /* options */ }),
],
});
```




Expand Down

0 comments on commit 73df2d3

Please sign in to comment.