#2598February 24, 2020by olgertpysqyli1 answer
I have a problem with video component. I select provider and add the source of the video and then save the html, but when i load the html again to the editor video component source gets replaced with < svg xmlns="http://www.w3.org/2000/svg" width="100" viewBox="0 0 24 24" style="fill: rgba(0,0,0,0.15); transform: scal...
artf
Hi @olgertpysqyli you should follow this and rely on JSON data for editing https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates
#2597February 24, 2020by ikenderham1 answer
Hello.. I need to put af custom name on my components. I can do that by adding data-gjs-custom-name="myname" but how do i do that on allready inserted elements? I tried to editor.SelectorManager.getAll().each(selector => $('h1').attr("data-gjs-custom-name","h1")); but its not working. How is it possible to put a name...
artf
I can do that by adding data-gjs-custom-name="myname" Use name instead of custom-name (this one is used for Layers when you edit them), so data-gjs-name="myname"How is it possible to put a name on all h1, for example? You can create a cust...
#2596February 24, 2020by cristianumali223 answers
[QUESTION] Hi! I'm retrieving dynamic html,css and js codes from the database. How can I create Blocks with this? Currently, this is my code, ``` editor.BlockManager.add($aBlock['name'], { id: $aBlock['name'], label: $aBlock['name'], category: $aBlock['category'], content: $aBlock['html'], style: $aBlock['css'], scrip...
cristianumali22
Hi @pouyamiralayi , thus, doing, content: '<div></div><style></style>' will seperate the HTML from CSS in the download code feature of GrapesJS? Note that in every blocks of code, there is different HTML, CSS and JS. Is the css of, example...
pouyamiralayi
@cristianumali22 your code looks fine and it is not executed before grapesjs initialization because you are passing the reference and not actually calling it! i suggest using the grapesjs cli because it is doing all the setups for you and...
pouyamiralayi
@cristianumali22 please consider putting both your `html and css inside the content` property like this: for including scripts, you must define a new component type and then proceed to component & js Cheers!
#2595February 24, 2020by Davidvlv3 answers
I want to make an external html element able to be dragged into GrapesJS, like how you can drag in a block and it will add something. I have a sample, with a div with draggable="true", a regular div and an image. The image drags in fine and if you select the regular div's text and drag that in it works, but the div wi...
artf
@Davidvlv HTML5 D&D doesn't work like that, adding draggable="true" is not enough. This just tells the browser "Hey you can drag me!", but you have also to specify WHAT do you want to drag (using dataTransfer.setData API). Here is your exa...
sdrebel
Have u tried this? editor = grapesjs.init({ ....... dragMode: 'absolute', // 'absolute' | 'translate' ...... }) And also you can set drag mode for each component. https://grapesjs.com/docs/api/component.html#index
Davidvlv
Hi @sdrebel This doesn't solve my problem. I have attached a video showcasing the jsfiddle - note the div with draggable="true" doesn't drag into the editor. grapesjs import draggable.zip
#2594February 22, 2020by eduardo-loyica1 answer
Is it possible to add an extra button to call any other action inside the default asset manager? Something like this: <img width="895" alt="Screen Shot 2020-02-21 at 16 45 45" src="https://user-images.githubusercontent.com/26910184/75078089-48385600-54ca-11ea-9ad0-6279e7a8b20e.png">
#2593February 21, 2020by Davidvlv2 answers
Hello, We are having a major issue - our layouts use copious amounts of display: flex; flex-direction: column;, and this is causing extreme amounts of lag in Chrome and Safari browsers (not Firefox). If the flex-direction style is set to row, there is no slowdown at all. Sample: https://jsfiddle.net/gkeft254/ click on...
artf
Yeah, it's definitely slower, not sure what is really happening but at the first guess, it might be this function which checks if the component is a block (eg. div) or an inline element (eg. span) https://github.com/artf/grapesjs/blob/1214...
artf
Not able to reproduce anymore
#2592February 21, 2020by kaoz703 answers
Hello, is there a way to set a modal's width, its currently set to 850px by CSS, but I would like to create a dialog with a small amount of text and its too big for this: But it would be great to get this: Without overriding the CSS, because I would still like to use large modals. I checked the source code and the doc...
ronaldaug
For those who don't know how to use modal attributes. You can add option opts.attributes to modal's open method as below. Because I didn't find how to use it in the documentation here.
kaoz70
OK, what I'm thinking is to create a function to be able to set the width like: setWidth('400px'), and also a method to set custom attributes: setAttributes({'data-custom-attribute': 123}). I think 2 functions are needed because the width...
kaoz70
Hello, sorry I'm piled with work now, if @sunnykgupta can give this a shot it would be great.
#2591February 20, 2020by Jogai1 answer
I see that the version numbers are incremented, but the package is not published on npm after 0.15.15. Time for a 0.16 😃 Other issue about npm: https://github.com/artf/grapesjs/issues/2568 (not sure if related)
artf
It might happen to see a new build available in the dev repository but that means the version is not yet stable to be published 😉
#2590February 20, 2020by sdrebel3 answers
Hi @artf, Working with Grapesjs has been great so far. It's easy to use once we understand it. I just have one suggestion, is it possible to include grids and scale options in the editor?
artf
What do you mean by grids and scale?
sdrebel
Hi @artf, Attached the image. Something like this
artf
No, this is not available and not even planned, but if someone wants to try to integrate it (even via a plugin) please let me know
#2588February 19, 2020by cristianumali221 answer
Good day! how can am I going to create a sub-category to from the parent category? Is it possible like the image attached? PS. Image is only edited to show what I wanted to do.
artf
No, by default you can only use categories