grapejs-template

grapejs-template.markdown

grapejs-template

A Pen by Henrik on CodePen.

License.

index.html

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

script.js

var editor = grapesjs.init({
  container : '#gjs',
  fromElement: true,
});

scripts

<script src="https://unpkg.com/grapesjs"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

style.css

body, html { height: 100%; }
#gjs { height: 100% !important; }

/* We can remove the border we've set at the beginnig */
#gjs {
  border: none;
}
/* Theming */

/* Primary color for the background */
.gjs-one-bg {
  background-color: #efefef;
}

/* Secondary color for the text color */
.gjs-two-color {
  color: #232323;
}

/* Tertiary color for the background */
.gjs-three-bg {
  background-color: #232323;
  color: #efefef;
}

/* Quaternary color for the text color */
.gjs-four-color,
.gjs-four-color-h:hover {
  color: #23ef23;
}

styles

<link href="https://unpkg.com/grapesjs/dist/css/grapes.min.css" rel="stylesheet" />