GrapesJS Issues

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

829 issues found

🔍 question
#1450September 22, 2018by besingamkb2 answers
0 reactions

[QUESTIONS] Devices panel appendTo

Hi Everyone. I manage to redesign the grapesjs editor by using appendTo on the styleManager, layerManager and blockManager on its own division. I also use the grapesjs-preset-newsletter. But the device panel is still stick on the editor workspace. Is it possible to append on its own division? and I also notice. Some b...

artf

Device buttons are inserted by grapesjs-preset-newsletter, you have to move them on load via JS

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1436September 18, 2018by peakrams3 answers
3 reactions

[QUESTION] Atomic blocks or complex components

Hi, I'm studying the editor and I think I understand the difference between components and blocks. Now, I was wondering if GrapesJS offers the possibily to manage a block as an atomic entity or permits to define components as a tree with of nodes. For example, I have a block called separator that basically is a table...

artf

The main issue that I can foresee is that the source code should be importable so as it is generated by the editor and I'm not sure if the editor can distinguish the separator element from any td component of a table component used for tab...

artf

the fact that it has returned a type for this node prevents the editor from testing the inner nodes of this node for a component type? No, inner nodes will be still traversed, but you can actually prevent that with this as a return to your...

artf

Yeah, the content property could really solve my problem but I guess I have to manually keep it's value in sync (with string manipulation) with the changes made by the users to the properties and the traits of the separator component, and,...

#1428September 15, 2018by peakrams3 answers
5 reactions

[Question] Define or hide properties for specific components

Hi, I'm wondering if there is the possibility to define properties for specific components. I mean, when I select the component Image I would like that in the style manager panel the section relative to the Typography is not shown; in the same way, when I select a Table component I would like to see in the style manag...

juanj

I'm not sure if this is the optimal way of doing it but you can listen to the event component:selected and if the component selected is the one you want you can add a new sector. Then you need to listen to the event component:deselected an...

artf

Actually, you can also rely on a few Component's properties made exactly for this purpose:stylable - True if it's possible to style the component. You can also indicate an array of CSS properties which is possible to style, eg. ['color', '...

artf

@peakrams the warning is actually there but the Github's Markdown doesn't let you apply custom styles to make it more visible ¯\\\(ツ)\/¯

#1423September 13, 2018by jvillena2 answers
0 reactions

[QUESTIONS] Breadcrumb

Hi @artf, Now I'm working on creating a breadcrumb similar to the LayerManager but I would like to know if already exists a method that I can tell it the dom element to be hovered when I'm over the breadcrumb item similar as you are doing on the LayerManager. Thanks

artf

Each component has a status property, so in your breadcrumb view you can listen to change:status on each component model. Look at how it's implemented in ComponentView and just re-used in Layers here ItemView. So you can basically do the s...

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1414September 10, 2018by gabrigcl3 answers
0 reactions

[QUESTION] Component "first render" event

Hi. I'm developing a plugin for charts using chart.js. I need to persist the model of the chart inside the generated component to render the chart on back canvas loads. In order to achieve this, I decided to persist the model of the chart in an HTML atribute of the component. This is the generated HTML of the componen...

artf

You can use onRender

gabrigcl

Thanks, this method works! However, I have to store the model of the chart inside the html of the component, in order to make possible that the generated template render the chart outside the grapesjs editor. I can't persist anything insid...

artf

@gabrigcl I don't understand which is the problem now... I can't persist anything inside a custom html attribute of the component, the way I want But it's exactly what you've showed in your previous post, try elaborate better what you need...

#1411September 10, 2018by zurp2 answers
0 reactions

Manual triggering of the asset manager rendering is required after opening the AM pop-up

Questions Q: Are you using the latest release (older versions are NOT supported)? A: Yes Q. Are you facing the bug with your local copy of GrapesJS or with the current demo? A: Local copy, latest chrome on Linux 64bitThe issue When opening the asset manager via editor.runCommand('open-assets') it should render the lis...

artf

The issue is that currently open-assets doesn't handle correctly the default types option (which I think, in this case, it should return all assets, even not images). I'll fix this in the next release, but for now, what I think it should b...

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1407September 6, 2018by jvillena2 answers
0 reactions

[QUESTIONS] EXTRA TBODY ADDED EVERY TIME I SAVED THE HTML DATA.

Hi @artf, I had an issue when I have tables in the editor and I add new rows then if my table is saved when is loaded again an extra tbody tag is added to my table. I don't know why this behaviour is happening on the editor. Best Regards.

jvillena

Hi @artf, The issue is solved if I commented in the initialize method of the tbody in the grapesjs core. But I don't understand once you are including it without checking if the tbody tag already exist.

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1393August 29, 2018by pnellesen3 answers
1 reactions

[Question] Add grapesjs color picker to a new trait type?

I'm building a a new trait type, and would like to be able to include the grapesjs color picker inside it - any suggestions on how to do that? Right now I'm including the standard HTML color input in my "inputEl" html (along with a text field and radio button) but I would love to be able to use the one that comes with...

pnellesen

@nojacko I've modified my code a little, here's basically what I'm doing: Hope this helps. This is still a work in progress :) Note that the getInputEl method of the colorPicker appends a spectrum colorpicker to the body of the canvas each...

artf

Hi @pnellesen this is actually a really good question, definitely, we should allow doing so but unfortunately, right now it's not so straightforward. We should refactor few modules to make the UI more reusable. BTW try to extend editor.Tra...

pnellesen

@artf - thanks for the response! Your suggestion worked pretty well (and it even works in Internet Explorer, which is better than my html5 color picker :p ). I have some tweaks to do to my styling and my input data, but otherwise it's good...

#1379August 23, 2018by Abhisheknanda13444633 answers
1 reactions

Question : how to replace style-manager font-awesome icon into svg?

hi @artf i Want to replace an icon of style manager with svg icon . As you can see screenshot attached. I tried dat way.

artf

Yeah put those changes inside your plugin

artf

???... your code is all broken (check the syntax) Probably you want something like this

Abhisheknanda1344463

Please re-open this issue. hi @artf I also tried this way pnm.getButton('views', 'open-sm').set({ label: <svg> width="1024" height="1024" viewBox="0 0 1024 1024" style="margin-left: calc(50% - 0.5em)"><g transform="scale(0.03125 0.03125)">...

#1365August 15, 2018by shlomoko2 answers
0 reactions

[QUESTION] Vertical panel buttons

Hi, I am trying to add vertical buttons in a panel. I have added a flexbox with a vertical direction, but since an additional div is added as an interim to the buttons, it does not affect them. Is there a way to solve this? I have added the following code that does not appear to work ():

artf

@shlomoko sorry but I close this issue, has nothing to do with grapesjs itself, it's just about your UI layout setting

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.