I would like to be able to add extra functionality to the drag and drop of components, so as to allow for easy resizing and repositioning without having to manually go through the panels on the right side of the screen. Can you please provide some guidance on where in the code base to focus on? Has anyone else done an...
pouyamiralayi
allow for easy resizing you can add `resizable: true` to your component type definitionfunctionality to the drag and drop of components you can apply this on either the editor or an specific component: cheers!
rodenp
thanks @pouyamiralayi for your guidance. Will this also work for things like columns?
pouyamiralayi
@rodenp yes! every component type can use this property.
What we need is to create a page once but translate the text content in multiple languages. Imagine a very simple sample of a single text block saying "Hello" - we don't want to force the users to create another page with that same text block saying the same in different language. Imagine the page must be translated i...
varadero
Closing s duplicate of https://github.com/artf/grapesjs/issues/2342
pouyamiralayi
@varadero i18n module is on the roadmap cheers!
varadero
@pouyamiralayi But isn't that i18n mentioned there just a module that will allow you to translate GrapesJS itself, not the content that the user created ?
Hi Team, I'm trying to use the grapes cli tool (https://github.com/artf/grapesjs-cli) to create a plugin to be used with a react project. The cli tool created blocks.js, components.js and an index.js files. The index.js file contains the below code: Which of the following should be used to define components? Is the lo...
pouyamiralayi
@arunkumar413 this issue must be posted at grapesjs-cliWhich of the following should be used to define components? you must define your components at `components.js file. loadComponents is the named import of that file. after that you must...
artf
Could you please make a few codesandboxes to helps us better understand on how to use grapesjs with react, jsx, UI tool kits such as material-UI etc,. https://github.com/artf/grapesjs/issues/2370#issuecomment-550515205
Hi Team, I'm trying to use the material UI components in with the grapes but the material UI components aren't rendering as expected (https://codesandbox.io/s/grapesjsapp-umxf5). I have used this template (https://github.com/prashant2018/GrapesJs-React) to test the material UI. Also could you please clarify on the use...
pouyamiralayi
@arunkumar413 for material use case please refer to gramateriaplease clarify on the use case of this tool grapesjs is a template builder that currently supports web. also it provides api's that can easily be integrated with any type of cms...
artf
Also could you please clarify on the use case of this tool. Is this tool intended for building components using the regular HTML tags as opposed to using any framework like react? Or does this complement the react, angular, vue etc? https:...
Rishabh-prescience
I was able to integrate Material UI with GrapesJS, but I am stuck at Integration of ApexCharts. Can anyone look into it? 'CodeSandBox'. Thanks in advance
In the new dragmode the component's style is not updated after dragging the component. Expected behaviour:Drag element by clicking on the component(or the toolbar icon)After the components is 'dropped' the style should be updated with the new position Current behaviour:You drag the component somewhere elseThe x and y...
artf
Have a set x and y values(for example 0px and 0px) For x/y you mean left/top?
MartinPutz
Yes, left and top should change and should be updated but they remain the same.
artf
I see them changing only after reselecting the component, can you confirm?
Hi guys, first of all excellent work! I tried following the tutorial but I am unable to understand how to add a custom block, to which after selecting it the user can fill in parameters (name and title for example) from the menu on the right. I read about blocks, components and traits but I fail to understand how to w...
I have to remove badgable to all the components. I have added this on editor.init domComponents: { wrapper: { badgable: false }, }, Still not working. Please help
niveth09
Hi @suchiitsme, I am facing the same issue. Can you tell me how did you fix that?
suchiitsme
OK. I have fixed this
elquchiri
@niveth09, the simple way is to hide the css class => https://github.com/GrapesJS/grapesjs/issues/2441#issuecomment-562992791
Hello, i'm trying to delete some of the default styles of the blocks. I wrote everything I changed in a plugin. I used this function to update for example the Text Components style-defaults: editor.DomComponents.addType(.....) seen here: https://grapesjs.com/docs/modules/Components.html#update-component-type Am I gett...
pouyamiralayi
Hi there! have you tried using setStyle ? cheers.
artf
I'd expect something like this to work (update style-default) Be sure to load your plugin after the mjml one
navewi
Hello @artf, thanks for your reply. this is the exact same code, that i tried out. This one works if I use "style" instead of "style-default".
Hi @artf , I'm thinking of opening a PR for an update on the RichTextEditor. I thought I'd run the idea past you first before getting to work on it. It proposes a change to the actions to have a state, which is an optional function that returns an integer to depict the state of each action; 1 for active, 0 for inactiv...
artf
It proposes a change to the actions to have a state, which is an optional function that returns an integer to depict the state of each action; 1 for active, 0 for inactive, -1 for disabled. Thanks for the suggestion, I think it might be a...
I have created custom components and blocks, but when value of traits change, the rendered element gets invisible from the canvas until it is reloaded. So whenever this line is executed, the loaded block gets invisible or unrendered. A workaround that i got was to re-render DomComponents after this call: but that does...
artf
@mustahsanmustafa I think there is something wring here... For any new app-body component you're creating a new inside with this this.components('<app-body props='${value}'></app-body>'). The method this.components updates inner content no...
pouyamiralayi
Hi there! being more specific in reaction to what attribute is actually changing would help you to reduce the performance issue in your case. cheers!