Skip to content

Instantly share code, notes, and snippets.

@Staubgeborener
Created July 7, 2023 19:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Staubgeborener/4b4af99ad4807a2d51ee6e11694fb521 to your computer and use it in GitHub Desktop.
Save Staubgeborener/4b4af99ad4807a2d51ee6e11694fb521 to your computer and use it in GitHub Desktop.
GrapesJS in Visual Studio Code - fast Deployment
<!-- Install Live Server Extension in Visual Studio Code, copy/paste this in index.html file and do right click -> Open with Live Server
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Grapes JS Example</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/grapesjs/0.21.3/grapes.min.js"></script>
<link rel="stylesheet" href="css/lib/grapes.min.css" />
<!-- Add Style and Script for Preset Webpage Builder -->
<script src="js/lib/grapesjs-preset-webpage.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/grapesjs/0.21.3/css/grapes.min.css" />
<link rel="stylesheet" href="css/main.css" />
</head>
<body>
<div id="editor">
<p>Testing Editor using Grapes JS librrary</p>
</div>
<script>
const editor = grapesjs.init({
container: '#editor',
fromElement: true,
width: "auto",
storageManager: false,
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment