GrapesJS Issues

Search parsed GitHub issues, see highlighted answers, and open the original discussion when needed.

3464 issues found

#2850June 22, 2020by Aiyush-G3 answers
0 reactions

[QUESTION] Add Dropdown to block using Traits

Hi @artf , I hope that you are well, I was wondering whether you could help me with some simple issue that I am having (I have recently started using GrapeJS. Issue: using a plugin create a block and within the traits section have a drop down that changes the type of block displayed. Here is my current plugin code whi...

cartifon

I'm not sure if you can change the block once you added it.... Maybe you should just have classes to add to the blocks, that you can change the color, size or something like that. You can take a look on the CSS composer for it. https://gra...

artf

@Aiyush-G I think you should create a custom component with that trait which then changes the content, the block itself would just contain that component

Aiyush-G

Hi yes, this is what I was thinking, would you mind doing an example for me that changes the html content e.g. choosing red shows your chose red as a <p> tag and if you choose orange that is shows you chose orange and a <p>

#2849June 21, 2020by meyerco3 answers
1 reactions

[BUG] Using image url for background-image is not working properly

DescriptionOn our project for images assets we use url instead of base64 code .Expected behavior When setting a background-image to a control , it has to update the css of this control .The css have to be reflected on the canvas and the style panel .What happens instead ? If the image have spaces or parentheses on its...

meyerco

Hi @artf , #2975 Here is a PR to fix the issue . Please update me if its good enough . Thanks

artf

Thanks for the report, I'd appreciate a PR for this issue

meyerco

Can you direct me to a file , where background-image is set ?

#2848June 21, 2020by Aiyush-G1 answer
0 reactions

External CSS not loading in Canvas

Using CSS in Init results in blank screen: I want to link multiple css files so that on the actual webpage I can define classes e.g. Within Css file (example): And on webpage I would like to define text (e.g) to have class h6 or create a custom block where I can predefine classes. However, this doesn't work because th...

Aiyush-G

SOLVED: INCORRECT SYNTAX

#2845June 20, 2020by BerkeAras3 answers
1 reactions

[Feature]: Drag-and-Drop Images

Hello, what about a drag-and-drop for images into image-elements? Like this:

micker

interesting !

artf

I think you can accomplish that by extending the default image component. As the user is already able to drop images in the canvas by using the HTML5 D&D I would skip such a feature from the core component.

revdfdev

Is there any example to extend an image component

#2844June 20, 2020by akashdesale981 answer
0 reactions

[BUG] If we give "<input data-gjs-type="myInput" type="text" required/>" this html string to setComponents, it sets it like "<input data-gjs-type="myInput" type="text" required=""/>" in code manager

editor.setComponents("html stiring"), method which takes html string as an input and sets that code in the html section in the Code Manager if we pass ,<input data-gjs-type="myInput" type="text" required/>" to editor.setComponents, then its output will be "<input data-gjs-type="myInput" type="text" required=""/> If yo...

artf

For now, you can avoid it only by adding the Component Definition in this way but I'll update the HTML parser in the next release to handle this properly

#2843June 19, 2020by abozhinov3 answers
0 reactions

[BUG] Can't remove style property on selected device

Hi, have a problem with removing style property on selected device (clearProperties: true). You can reproduce the problem on https://grapesjs.com/demo.html. Steps:Clean everything.Drag custom code.Add this sample code.Switch devices to tablet or mobile and select the component.In the Typography style you can see that...

abozhinov

@artf do you have idea how can i fix it?

artf

To make the StyleManager read the proper style rule your media query should reflect the same width of the selected Device. Did you try it?

abozhinov

Yes I do it. deviceManager: { devices: [ { name: 'Desktop', width: '', priority: 3 }, { name: 'Tablet', width: '768px', widthMedia: '991px', priority: 2 }, { name: 'Mobile', width: '360px', height: '640px', widthMedia: '767px', priority: 1...

#2842June 19, 2020by BerkeAras3 answers
0 reactions

[Bug]: Text shadow disappears on doubleclick

Hello. I have a problem, that the text shadow on text element disappears when I doubleclick the element. What should I do? Here is my code: https://pastebin.berkearas.de/?e1c4c8db9a70894f#DCUHVHZzyhFTnAk2RoJ9faQxQPvAqWMoiBqXHMEzRH5G

BerkeAras

Edit: The Text Shadow does not disappear. The shadow color is set to the shadow blur, and shadow blur gets 0.

BerkeAras

artf

I can't reproduce it on the main demo so I'd need also a live demo of your case

#2841June 19, 2020by BerkeAras3 answers
1 reactions

[Bug]: Cannot use 'delete key' on keyboard when editing text.

Hello. I have a problem, that I can edit text, but I cant use the delete key on keyboard. Here is my code: https://pastebin.berkearas.de/?e1c4c8db9a70894f#DCUHVHZzyhFTnAk2RoJ9faQxQPvAqWMoiBqXHMEzRH5G

artf

Thanks for the report, I'll push a new release with the fix

aakos

I have the same problem. Version: 0.15.8 Tested: Chrome 83 Tracked it down to keymaster blocking. Running this would let edited text backspace delete: editor.Keymaps.keymaster.unbind('backspace')); Could be this #2758

BerkeAras

@aakos Thank you. `editor.Keymaps.keymaster.unbind('backspace');editor.Keymaps.keymaster.unbind('delete');` works. But there should be a fix for that problem.