GrapesJS Issues

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

3464 issues found

#2647March 13, 2020by jcamejo3 answers
3 reactions

Drag placeholder does not calculate the correct width.

HI @artf, I hope you are having a nice day. There's a small issue with the drag placeholder when a block is being dragged into a possible container with lateral margins, It could happen also with top/bottom margins or padding but I'm not 100% sure. <img width="1107" alt="image" src="https://user-images.githubuserconte...

artf

To be honest, I'd leave getElRect as it is, using getComputedStyle in this context would be too much expensive and the function itself is a generic one (so it doesn't make sense having there stuff like boundingRect.width = boundingRect.wid...

jcamejo

I got to getElRect by reading through the getDim function but i will do the research there again to look for another solution. Thanks!

bgrand-ch

Hello, For future questions or technical issues, which aren't bugs, GitHub's Discussions tab is the place to be. Don't forget to close this issue if it is resolved or write a new detailed message in Discussions -> Q&A category (and close t...

#2646March 13, 2020by verloka3 answers
16 reactions

[QUESTION] Body sectors

How to add the Dimension sector for the body?

mcottret

Hi @verloka & @pouyamiralayi, The sectors list seems to be common to all applications components. However, components hold a list of attributes that can be edited through the style manager panel when they are selected, which is used to fil...

pouyamiralayi

@verloka based on @mcottret answer, you can bring back the whole styling options like this: Cheers!

mcottret

> Hi @verloka & @pouyamiralayi,> The sectors list seems to be common to all applications components.> However, components hold a list of attributes that can be edited through the style manager panel when they are selected, which is used to...

#2645March 13, 2020by Rasazna2 answers
2 reactions

how to add new content to the intended component without removing the previously added component content

WARNING READ and FOLLOW next 5 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdUse the GitHub Issues EXCLUSIVELY for BUGS, FEATURE REQUESTS or QUESTIONS. Prefix the title of the issue with its context, eg. [Bug]: ....Do a quick...

pouyamiralayi

append

Rasazna

I want to add data to the div component without removing the previosuly added data using the trait manager option is there a way to do it. Can some one help m e with a sample code for this.

#2644March 13, 2020by Eshayat3 answers
7 reactions

[HELP] GrapesJS load html/css from Database

Hi there, We are using grapesjs in our Angular app. We have managed to create and save the grapesjs html/css in our database. One of the things we still couldn't find our that, In edit mode we want to call our API and get the HTML, CSS and load it into grapesjs canvas. We have tried with storage manager but that didn'...

mcottret

At first, I'm thinking i won't use the native storage manager that's how i wanted to call.Let me know how we should do this, If for any reason you're not willing to use the storage manager, I believe this configuration can only be used to...

mcottret

Hi @Eshayat,We have tried with storage manager but that didn't work Could you elaborate ? Have you properly followed the "Setup remote storage" & "Setup the server" sections of the "Storage Manager" documentation ? The following configurat...

Eshayat

Hey there, the second method worked. Thank you

#2641March 12, 2020by vFire3 answers
0 reactions

Code editor Support

I am wondering is it possible to have a code editor in GrapesJs, if will be much better for frontend developer. And if it support sysn scroll will be better, e.g. when you right click the element, the code will auto scroll and hightlight the code block related to the element.

vFire

And an option we can disable the style manager, since in the real world end user if not a technical guy , he will not understand css style and the style is too complicated, and for the frontend developer, without a code editor, it is too h...

vFire

Further more, I just want to set some rule in particular level of tag it will be selectable and visually editable, but beyond the rule the visual won't change it, alternately we can just select it in the code editor and directly edit by ro...

artf

This might be a good candidate for a plugin https://grapesjs.com/docs/modules/Plugins.html

#2640March 12, 2020by Ace06113 answers
2 reactions

Adding extra attributes with Stylemanager to change selected block's attribute

Thanks for this awesome plugin. I am integrating it with my current project. Have one issue with it. Here is my code, I have added a new sector with 3 input fields, I want to change the selected block's attribute(id, readOnly) with my value in those input fields. for instance: I want to change id of the selected block...

pouyamiralayi

@Ace0611 you can use traits for both controlling props (id, title & etc) and attributes. Cheers!

pouyamiralayi

@Ace0611 Will using id by traits override that? yes! `id is just a regular prop like others. And notice that grapesjs already provides you with default traits for id & title`. Cheers!

Ace0611

@pouyamiralayi : Thanks for helping me out. One doubt though, Every block that is being dragged, generates a dynamic id. Will using id by traits override that? My apologies, I am travelling right now, so cant do it myself at the moment. I...

#2639March 12, 2020by MiseryMachine3 answers
0 reactions

[QUESTION]: GrapesJS moving Mustache tokens

Hello, I am working with GrapesJS to allow users to create report templates. I've run into a problem with a block that creates a table, but the table rows are determined by Mustache tokens. However, when rendered, the tokens are moved outside of the table element. I believe the table or table row style is not allowing...

pouyamiralayi

@MiseryMachine have you tried wrapping your table internal's inside a `tbody` in your block definition? or at least moving your mustache tokens inside a tag?

MiseryMachine

Thanks for your suggestion. I have tried that with the same result, unfortunately. block script: Output: Maybe it's because GrapesJS is, by default, enforcing HTML structure. I'm still trying to work this out though.

artf

No, you can't do that because in that case, you have an invalid HTML, so the HTML parser moves it out. You have to create a valid HTML content to make the browser render it correctly:

#2638March 11, 2020by orionseye1 answer
1 reactions

[HELP] Adding new category for later use (without blocks yet)

How do i define a new category, to use for later blocks i create ..without yet assigning a block to it.. and keep it closed by default? I mean this one can be used to for a block added, but what if i have multiple blocks to add to same category again and again? Is there a way to have the category id, label, open state...

artf

Once the category is created you can use its ID in this way category: 'some-cat'

#2637March 11, 2020by mcottret3 answers
1 reactions

[Bug]: Preview mode & automatic components borders toggling

Hello again :) Our team recently started customising the editor & removing the webpage preset, and we might have found some bugs related to the preview mode:When exiting preview mode, an error can be raised if the default options panel has been removed, or if the sw-visibility button has been removed from it (from her...

artf

button would already be deactivated by the time Preview's run would be executed no matter what, is that correct ? oh yeah, right 🤦‍♂ From your reply on the linked issue, I understand this behaviour is intended, so maybe the solution is si...

artf

Thanks @mcottret for all the references, really well-written issue :)When the preview & the sw-visibility buttons are in the same panel, the behaviour introduced by #2589 breaks, this seems to come from the ButtonView's active change liste...

mcottret

Thanks for the reply @artf ! I'm sorry but I'm not sure how to make this work, from what I understand the active change listener gets executed before the Preview's run, so the sw-visibility button would already be deactivated by the time P...