GrapesJS Issues

Search parsed GitHub issues, see highlighted answers, and open the original discussion when needed.

3464 issues found

#2786May 18, 2020by amitbhoj7771 answer
0 reactions

Adding multiple text type traits

Whenever i am trying to add multiple traits of type text with all different conditions and on different tags/attributes but it will take only last one at every traits conditions. Please help me out with the solution. Below is the code editor.DomComponents.addType('text', { isComponent: el =>( (el.attributes&&el.attrib...

amitbhoj777

Got the solution. we need to extend type text in traits. Thankyou. editor.DomComponents.addType('paraJustify', { isComponent: el => ((el.attributes && el.attributes.paraJustify && el.attributes.paraJustify.value)), extend: 'text', model: {...

#2785May 18, 2020by amitbhoj7772 answers
0 reactions

Adding multiple text type traits.

Whenever i am trying to add multiple traits of type text with all different conditions and on different tags but it will take only last one at every traits conditions. Please help me out with the solution.

artf

Read the issue template then provide code and demo

amitbhoj777

editor.DomComponents.addType('text', { isComponent: el =>( (el.attributes&&el.attributes.paraJustify&&el.attributes.paraJustify.value) ), model: { defaults: { traits: [ { type: 'select', options: [ { value: 'text-align:center', name: 'Cent...

#2784May 17, 2020by joshbedo3 answers
1 reactions

Are media queries broke?

I'm just trying the demo on my phone https://grapesjs.com/demo.html render of HTML/CSS https://us-central1-connectionhelper-6e7ed.cloudfunctions.net/app/api/pages and noticed that it still looks like the desktop version. When i'm in the editor and look at the mobile version it looks a bit different. Kind of confused w...

vinceumo

Hi @artf I did open an issue regarding mine with a codesandbox https://github.com/artf/grapesjs/issues/2774 My issue was actually more about style not being render correctly in the canvas. My issue above was actually on my side as it was m...

montali

I second this!

vinceumo

Same issue on 0.16.12, When importing CSS with media query most css in the media query get removed, but not all?? I tried with the postcss parser as well and same issue.

#2782May 17, 2020by joshbedo1 answer
0 reactions

Best way to render a page stored in firestore?

I've been reading a lot of the documentation and closed issues but I'm a little confused on the best approach to render a page stored in firestore. For example I have a node.js backend using cloud functions and i was thinking i would basically have an API endpoint that pulls the page from the firestore and renders it....

artf

Hi Josh, storing and loading templates is described more in details here: https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates Basically, the editor stores 2 types of data: components and style, JSON result of your templ...

#2781May 16, 2020by adamwpe2 answers
0 reactions

Unable to Press Space Within Button Componet

Hi Guys, I have a button component, it lets me edit the text, but doesn't let me type a space ' '. Though you can copy and paste one in. I have an example here: https://jsfiddle.net/qz2cumo6/2/ Any idea why that would be? Thanks,

Mohsen-Khakbiz

try adding components like this

adamwpe

That's a nice simple solution - worked a treat.

#2779May 15, 2020by bt0rNo answers
0 reactions

[Fix] French i18n translations fixes

Description Hello guys, Padding translations keys are wrongly translated in French language. As Padding is an english word, there is no sense to keep it in French. Correction Fixes can be differents depending on which kind of users you want to reach. For a developer, Padding & Margin are really common but if its for a...

#2778May 15, 2020by ashishtyd2 answers
0 reactions

BUGS - Cannot read property 'querySelector' of null at r.getBody

Hi I was trying to use grapesjs on visualsource pages. Following is the init function - initEditor: function(){ var self = this; this.editor = grapesjs.init({ container: '#gjs', fromElement: true, height: '500px', width: 'auto', storageManager: false, panels: { defaults: [] }, blockManager: { appendTo: '#blocks', bloc...

artf

Create a reproducible demo please

no-response[bot]

This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take ac...

#2777May 14, 2020by kuhelbeher3 answers
2 reactions

[QUESTION] How to update styles in Style Manager

Hello. I created custom component where I set backgraound-image via custom asset manager Custom block code: Command which I run to set new image: It is working fine, image sets. But background property in Styles Manager doesn't update after image set. How can I update background property in style manager?

Ju99ernaut

Noticed that in general when you update styles for a component through code they do not reflect in the Styles Manager until you deselect and reselect the component and I can't find anything in the docs about refreshing the Styles Manager....

Ju99ernaut

Here #2728 they use: My guess is that background image is not updating because the src attribute is set instead of the background-image style property.

kuhelbeher

@Ju99ernaut thanks for advice but unfortunately it didn't worked. Also I noticed that properties like background-size or background-repeat also not reflected properly in Style Manager although it is set for selected component.

#2776May 14, 2020by math-artist3 answers
3 reactions

[QUESTION] Is it possible to use grapejs for printable documents?

Hello, I have a requirement to create a drag and drop template editor for a desktop application, to generate beautiful reports, and found almost nothing to do that easily. Then I found grapejs, and I am considering using the Qt WebEngine and have grapejs embedded in my application. I may have a web-based version of my...

Ju99ernaut

I think grapesjs would be perfect for your use case. Here #2724 it's probably being used in the same context.

Ju99ernaut

For pages that's a matter of creating a page block with height defined. As for variable tags, those can be included in the block as well.

math-artist

Ok, that seems like the right solution to manage a long list or table. Is there a way to lock the height of the web page and see the layout limit while editing? My plan is to create 3 or 4 pages with the same footer and insert variable tag...