GrapesJS Issues

3,464 parsed GitHub issues β€” 370 solved Β· 90 open. Search, filter and explore battle-tested answers.

183 issues found

πŸ” documentation
#3269Feb 12, 2021by acondura4 answers
0 reactions

Translating html string

Great library! It meets all the requirements but one: website text translation. I've searched high and low through the issue queue and docs and for some reason I can't find anything about this subject. My clients do not care that the grapesjs editor is in English. What they want is the ability to easily translate thei...

artf

This is something you would need to create on your own. Maybe a custom text component, which gives the possibility to change the content with the selected language.

jordandevogelaere

@acondura do you have a solution for this? I have the same requirement for my client. Thanks

gxanshu

i have the same requirement too. and yes only way we can achive this is by creating our own component

#3263Feb 4, 2021by san-1232 answers
0 reactions

Remote storage issues

Hi, grapeJs initiated, I normally load function call and append content to gjs div, $.ajax({ type: "GET", url: '' processData: false, contentType: 'application/json; charset=utf-8', DataType: "Json", $.each(data, function (key, data) { $('#gjs').append(html); } }); My issues, After save content, reload same function c...

artf

https://grapesjs.com/docs/modules/Storage.html

GJSBlock

Thanks for reporting this, @san-123. Great question about Remote storage issues. The recommended approach with GrapesJS is to use the event-driven API. Start here: Check the GrapesJS documentation for your specific module Look for the on()...

#3261Feb 4, 2021by nithinpillalamarri1231 answer
0 reactions

How to customise the grapes js form to append style

WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdDo a quick SEARCH first, to see if someone else didn't open the same issueAll relative statements/questions have to be filled/answered, otherwise, th...

GJSBlock

Thanks for reporting this, @nithinpillalamarri123. The issue with how to customise the grapes js form to append style appears to be a race condition or state management timing problem. This typically happens when component lifecycle events...

#3259Feb 3, 2021by bgrand-ch2 answers
1 reactions

V0.16.27 - Style/ID disappear when nested span

Version: 0.16.27 Are you able to reproduce the bug from the demo? [ ] Yes [ ] No [X] Video but no demo What is the expected behavior? Add as many nested span elements as necessary and preserve their style/ID. What is the current behavior? From two nested span elements, style/ID of parent span elements disappear. Are y...

artf

Hi Benjamin, the bug was already fixed (when you report a bug, ensure to have the latest version)

GJSBlock

Thanks for reporting this, @bgrand-ch. The issue with v0.16.27 - Style/ID disappear when nested span appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and DOM modifica...

#3258Feb 2, 2021by stljeff14 answers
0 reactions

Prevent/Disable Custom Blocks from being dropped inside other Custom Blocks

Hello, I have a custom component, let's call it a Section Block. I want to prevent the user from dropping Section Blocks inside other Section Blocks. Is that possible? Ref: https://grapesjs.com/docs/modules/Components.html#define-custom-component-type I am aware of the draggable/droppable options that I can define on...

artf

You can use :not() selector, eg. :not(.except-this-class)

stljeff1

Thanks @artf . This solution works, mostly. Now I am encountering a new problem where some placeholder text is disappearing. On some elements inside my blocks, I'll have an HTML element with a text node, then some other nested html element...

artf

You're defining the component with the old API, which requires other stuff to work properly and that might be the cause of the issue (I've tried on my side and everything works as expected). Please check here for the correct API https://gr...

#3256Feb 1, 2021by kumarabhishek0082 answers
0 reactions

Background Image of wrapper component is not loading in second time when updating

WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdDo a quick SEARCH first, to see if someone else didn't open the same issueAll relative statements/questions have to be filled/answered, otherwise, th...

kumarabhishek008

Issue has been resolved

GJSBlock

Thanks for reporting this, @kumarabhishek008. The issue with Background Image of wrapper component is not loading in second time when updating appears to be a race condition or state management timing problem. This typically happens when c...

#3251Jan 28, 2021by RutujaBadbe4 answers
0 reactions

How can I specify position of dropped element ?

I want to specify the position of dragging element. for example, if I have a header block which no matter where you drag, it should be placed at the top of document. how should I do that?

RutujaBadbe

after dropping the header block into the canvas, I need it to go at top of any other component/block. currently, I am doing this. but it is not working. editor.on('canvas:drop',(DataTransfer, model)=> { if (model.is('header')) { var index...

artf

You can use draggable property to define (via CSS query strings) where the component could be placed but you can't specify the position. You can try to create a custom component as a container for components like the header and init always...

RutujaBadbe

@artf thanks for the reply. I don't know if it is correct way but I did something and it worked for me. I am quite new at this and still learning from docs. I did this- editor.on('canvas:drop',( model)=> { if (model.is('header')) { //creat...

#3246Jan 23, 2021by ThetripGr2 answers
2 reactions

Is it possible to use existing trait types in new custom traits? (e.g the colorpicker)

I would like to create a new custom trait to use, that has the input of the color picker and a checkbox so that the end result is either the predefined color coming from the checked checkbox or if unchecked choosing from the picker. This is too specific for my case so my question is if i can use pre-existing trait typ...

artf

Not at the moment, I'm working on a new UI module that will allow the reuse and override of internal UI elements.

GJSBlock

Thanks for reporting this, @ThetripGr. Great question about Is it possible to use existing trait types in new custom traits? (e.g the colorpicker). The recommended approach with GrapesJS is to use the event-driven API. Start here: Check th...

#3242Jan 20, 2021by Nielsticot4 answers
0 reactions

When Style Manager is in another div, the message "Select an element before using Style Manager" is not showing

Version: 0.16.34 What is the expected behavior? When the editor is initialized, no element is selected, so the style manager should say "Select an element before using Style Manager" like it does when not using "appendTo" in the editor configuration. What is the current behavior? When using "appendTo" in the editor co...

mosh-tudor

I used this code to solve it:

Nielsticot

This is not what I want, my issue is before any element is selected so before the event "component:selected" is trigerred. I temporarily fixed it by selecting an element on editor load but it is not what I really want

artf

If you're using the StyleManager in a custom element you have to handle that state on your own.

#3235Jan 15, 2021by AnnaSu1 answer
0 reactions

"component:update" does not trigger when components are moved

Taken from https://github.com/artf/grapesjs/blob/dev/src/editor/index.js#L33 component:update - Triggered when a component is updated (moved, styled, etc.), the model is passed as an argument to the callback reproduce the buguse move API to move componenthttps://grapesjs.com/docs/api/component.html#moveclick arrow up/...

GJSBlock

Thanks for reporting this, @AnnaSu. The issue with "component:update" does not trigger when components are moved appears to be a race condition or state management timing problem. This typically happens when component lifecycle events and...

Browse all topics