GrapesJS Issues

3,464 parsed GitHub issues โ€” 370 solved ยท 90 open. Search, filter and explore battle-tested answers.

829 issues found

๐Ÿ” question
#2612March 2, 2020by pradeeshattlee1 answer
0 reactions

GrapesJs Asset Manager Not working with iPad & Touch enabled devices

Hey @artf I have a question around Asset Manager. When uploading an image via computer or URL You can create image blocks with the command from the left panel and edit them with double click everything Seems to work perfectly. But when I try the same in an iPad or a Touch-enabled device it doesn't work I used this Plu...

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...

#2601February 26, 2020by cristianumali222 answers
1 reactions

[QUESTION/BUG?] Dragging second block don't haveCSS

Hi! I've manage to create different blocks with their own HTML and CSS using BlockManager. But once I drag the same block, the CSS is not working. I've already debug it. And I found that its renaming the my blocks' id. Example. I have a table with an id of custom-table. And when I drag the same table, the id becomes c...

rjrodriguezalvarez97

Try styling with classes as selector rather than ids

artf

You can't have multiple elements with the same ID (against also HTML5 specs) so the editor tries to fix that, so yeah, you have to use classes

#2596February 24, 2020by cristianumali223 answers
2 reactions

[QUESTION] Add html, css and js to Block Manager

[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
1 reactions

[Question] Having trouble dragging external html with draggable="true"

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

#2586February 19, 2020by liudmyla-schastlyvets2 answers
0 reactions

[Question]: How update style manager panel using few devices and custom css class

There is a custom class added to simple grapesjs project: If there is no devices and user adds the class into the selectors field Settings sector is updated its font-size property correctly. <img width="1440" alt="Screen Shot 2020-02-19 at 2 33 50 AM" src="https://user-images.githubusercontent.com/32596493/74790527-7b...

artf

Unfortunately, this is due to how getComputedStyle works, which returns resolved values, so by using rem instead of px "confuses" the value. At the moment I don't have any plan on fixing this issue but I'd really appreciate a PR or at leas...

artf

This should be fixed in the latest release https://github.com/artf/grapesjs/releases/tag/v0.18.1

#2581February 18, 2020by Jogai3 answers
0 reactions

[Bug]: How to use components

Using GrapesJS 0.15.10 I cant get the components to work the way I intent. Its probable me, so if its a question, feel free to adjust the title of the issue. (its a follow up of https://github.com/artf/grapesjs/issues/2195) I've made a pen (hope thats ok, didnt see the fiddle templates) for my example: https://codepen...

pouyamiralayi

Hi @Jogai you must also specify the `data-gjs-draggable on the <td>`: Cheers!

Jogai

Thanks. At least thats an improvement, but still the other properties are not taken into account, and if you try tro drag it (since the drag arrows still show up) it throws an error and then the whole editor is in a broken state. I updated...

Jogai

Updated the example. Its sort of a followup on https://github.com/artf/grapesjs/issues/2195 My assumption is wrong that draggable needs data-gjs- prefix, because the html part without using component doesnt have that either. Still the chil...

#2577February 17, 2020by dskarasev1 answer
1 reactions

[QUESTION] How do I block the insertion of a block inside another block?

Please tell me how do I prevent inserting a block inside another block? I use the editor to create the internal structure of an article for a WEB site. Grapejs building blocks are not used. All custom blocks are added via the configuration editor.BlockManager.add I will be grateful if you can tell me how to do that. T...

pouyamiralayi

@dskarasev you can define custom component type and control the dragging using `draggable` property: Cheers!

#2575February 17, 2020by MCiocioNo answers
0 reactions

[QUESTION] Set HTML content

Hi @artf I've imported your plugin and all the 'get content' functions works correctly. Before this, on my web application I had the functionality to save different templates and to load them in evert moment. But my question is: there's a way to SET CONTENT of gjs newsletter editor? On the commands there's only the re...

#2574February 17, 2020by MCiocio1 answer
1 reactions

Thanks @artf for this work!

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

@MicheleBowl this is how you can support the project!

#2573February 17, 2020by rastaprime202 answers
0 reactions

[QUESTION] Get all related CSS Rules from mulit-level CSS Selectors

Hi @artf Hope you are doing well. I've been cracking on this matter for the past few days now, I've been searching whether I got the same scenario with the others, but unfortunately, I can't find any solutions that can solve my problem, so I decided to raise an issue ticket. I hope I will make sense. So I have a 'Save...

artf

This is the command I use in Grapedrop to get all the CSS from a component

rastaprime20

Hi @artf Thank you so much for your response! I will try this out, and let you know if I run into any problems. I really appreciate this.