Issue #2973πŸ’¬ AnsweredOpened Aug 25, 2020by trony20201 reactions

Make not removable elements inside a block

Quick answerby RJCAM❀ 1

So, I'm not sure if this are the best answers but they work for me.How to tell elements inside h4 are data-gjs-editable="false" also? With this attribute: contentEditable="false"if I delete all chars in a box then the box disappear, is there a way to not delete the box and keep a min-width? I'm doing this but the box...

Read full answer below ↓

Question

Hello, Given: editor.BlockManager.add('test-component', { id: 'MappaPiuDescrizione', label: 'Mappa + Descrizione', content: <div data-blockname='mappaDescrizione1'> <br/> <div data-blockname='mappaDescrizione2' style='margin:2px;border: 1px solid red'> <div><h3>Test Moto</h3></div> <div data-gjs-type="map" style='height:200px;width:400px'></div> <div>Test Zaltbommel<br> Schimminck 4<br> 5322 Daltbommel <br> Netherlands </div> </div> <br/> </div>, }); I want to make <div><h3>Test Moto</h3></div> not droppable, how it's done? With a class ? Like <div class='notDropppable'><h3>Test Moto</h3></di...

Answers (3)

RJCAMβ€’ Aug 26, 2020

So, I'm not sure if this are the best answers but they work for me.How to tell elements inside h4 are data-gjs-editable="false" also? With this attribute: contentEditable="false"if I delete all chars in a box then the box disappear, is there a way to not delete the box and keep a min-width? I'm doi...

RJCAMβ€’ Aug 25, 2020

Hi @trony2020 Not really a class, but you can do it adding some attributes indeed, like here in the documentation, when you add a new component to the DOM, it adds the property as an attribute of the added element. So you can do something like this: <div data-gjs-dropppable='false'><h3>Test Moto</h...

trony2020β€’ Aug 26, 2020

I've tried with editor.BlockManager.add('Title-component', { id: 'TitleEB', label: 'TitleEB', content: "<div data-blockname='TitleForm' style='width:600px' data-gjs-removable='false'>" + data + "</div>" }); where data is: <div id="headerText" class="info " data-ebplatform-template-elementId="boxHea...

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins β†’
Premium option

Premium plugins ship with support, regular updates, and production-ready features β€” save days of integration work.

Browse premium plugins β†’

Related tutorials

In-depth guides on the same topic.

All tutorials β†’

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.