grapesjs-custom-code

WebJar for grapesjs-custom-code

License

License

BSD 3-Clause
Categories

Categories

JavaScript Languages
GroupId

GroupId

org.webjars.npm
ArtifactId

ArtifactId

grapesjs-custom-code
Last Version

Last Version

0.1.1
Release Date

Release Date

Type

Type

jar
Description

Description

grapesjs-custom-code
WebJar for grapesjs-custom-code
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/artf/grapesjs-custom-code

Download grapesjs-custom-code

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.npm/grapesjs-custom-code/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>grapesjs-custom-code</artifactId>
    <version>0.1.1</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.npm/grapesjs-custom-code/
implementation 'org.webjars.npm:grapesjs-custom-code:0.1.1'
// https://jarcasting.com/artifacts/org.webjars.npm/grapesjs-custom-code/
implementation ("org.webjars.npm:grapesjs-custom-code:0.1.1")
'org.webjars.npm:grapesjs-custom-code:jar:0.1.1'
<dependency org="org.webjars.npm" name="grapesjs-custom-code" rev="0.1.1">
  <artifact name="grapesjs-custom-code" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.npm', module='grapesjs-custom-code', version='0.1.1')
)
libraryDependencies += "org.webjars.npm" % "grapesjs-custom-code" % "0.1.1"
[org.webjars.npm/grapesjs-custom-code "0.1.1"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

GrapesJS Custom Code

This plugin adds the possibility to embed custom code

GrapesJS Custom Code

Requires GrapesJS v0.14.25 or higher

Summary

  • Plugin name: grapesjs-custom-code
  • Components
    • custom-code
  • Blocks
    • custom-code
  • Commands
    • custom-code:open-modal

Options

Option Description Default
blockLabel Label of the custom code block Custom Code
blockCustomCode Object to extend the default custom code block, eg. { label: 'Custom Code', category: 'Extra', ... }. Pass a falsy value to avoid adding the block {}
propsCustomCode Object to extend the default custom code properties, eg. { name: 'Custom Code', droppable: false, ... } {}
placeholderContent Initial content of the custom code component <span>Insert here your custom code</span>
toolbarBtnCustomCode Object to extend the default component's toolbar button for the code, eg. { label: '</>', attributes: { title: 'Open custom code' } }. Pass a falsy value to avoid adding the button {}
placeholderScript Content to show when the custom code contains <script> Check the source
modalTitle Title for the modal Insert your code
codeViewOptions Additional options for the code viewer, eg. { theme: 'hopscotch', readOnly: 0 } {}
buttonLabel Label for the default save button Save
commandCustomCode Object to extend the default custom code command, eg. { getPreContent: () => '<div>Paste here</div>' } Check the source to see all available methods {}

Download

  • CDN
    • https://unpkg.com/grapesjs-custom-code
  • NPM
    • npm i grapesjs-custom-code
  • GIT
    • git clone https://github.com/artf/grapesjs-custom-code.git

Usage

<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-custom-code.min.js"></script>

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

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

Development

Clone the repository

$ git clone https://github.com/artf/grapesjs-custom-code.git
$ cd grapesjs-custom-code

Install dependencies

$ npm i

Start the dev server

$ npm start

License

BSD 3-Clause

Versions

Version
0.1.1