Finer drag and drop resizing and repositioning control
Question
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 anything similar who would like to share their experience and knowledge?
Thanks
Answers (3)
allow for easy resizing
you can add resizable: true to your component type definition
functionality to the drag and drop of components
you can apply this on either the editor or an specific component:
editor = grapesjs.init({
dragMode:'absolute',
})
// or for a specific component:
component.setDragMode('absolute')
cheers!
thanks @pouyamiralayi for your guidance. Will this also work for things like columns?
@rodenp yes! every component type can use this property.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1368
Resize canvas
Is there a way to have a dynamic resizing of the canvas? i.e not using the Device Manager, but having a drag and drop of the width, similar...
Issue #3721
Test drag and drop with Cypress
Hi @artf. I would like to run some test scenarios on GrapesJs using Cypress tool. However i am unable to simulate drag and drop mode using...
Issue #1756
Drag and Drop not working in resized editor window in Google Chrome
Hi, I developed some components and all works fine in Firefox, Opera browser. In Google chrome also working fine in fullscreen editor mode...
Issue #1200
Modify grapes.min.js to allow video types on AssetManager
Please, I would like to modify my grapes.min.js because I would like to add the video type to my assetManager. For some reason, the am.addT...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.