Define components in template
if you want to initialize the editor with some components already placed into the canvas, you need this: cheers.
Read full answer below ↓Question
QuestionsHow can I make a part of my template a component ?How can I set draggableComponents on such a component?If so, then can I stop setting selectable: false, highlightable: false, hoverable: false on the child nodes inside said component?Is it possible to supply a different external link to the component? More explanation and a code part I have a question because I think grapesjs is smarter than I use it currently. We have an asp.net app where its integrated, and we initialize it from an element. That element is the combination of our html template and data which give our users every day...
Answers (3)
if you want to initialize the editor with some components already placed into the canvas, you need this: cheers.
for the moment grapes has some issue on storing custom components defined outside plugins. Actually, are stored correctly, it's just about loading components that are not recognized because the custom type doesn't exist yet, so this is the reason for putting the code in the plugin (plugins are load...
Thanks for the answer and the links. They are really helpful. For this question however I was looking for a way to do this within a template. Currently we dont use the blockmanager, our users only drag stuff around. They never add anything.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2274
[QUESTION] How to load children of a readonly component?
I'm trying to mount a readonly component (draggable, droppable etc all set to false) and allow the user to edit child components inside. Fo...
Issue #1336
[Question] Can I make everything unselectable by default?
Currently all components are selectable/hoverable by default. And if you want you can change that behavior by providing data-gjs-hoverable=...
Issue #5705
Component tools misalign when the editor is resized
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome v122 Reproducible demo link https:/...
Issue #3586
how to listen the components change in a component.
init() { this.listenTo(this.model,'change:components', this.handleComponentsChange); }, I develop a component, I try to listen the child co...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.