GrapesJS Issues

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

71 issues found

#1194June 11, 2018by MobileAppVault2 answers
0 reactions

[QUESTION]: load existing html web template into GrapesJS

Hi, I want to load an existing HTML Template into grapesjs and edit the page. Edit means:move sectionsadd/remove edit buttons, images etc. My template source will be https://html5up.net/ for example. How I can achieve this? Do I need to split my template into components? Many thanks for any answer help or suggestions....

artf

You can import it as it is but take care of this #1173

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1193June 11, 2018by Siddharth-ss422792 answers
1 reactions

[QUESTION] Not able to initialize colorpicker !

Hi @artf , I made separate styles for mobile view . i want to initialize color-picker "onclick()". i want exactly same color-picker that you are using in grapesjs editor. how can i initialize same color-picker?? thanks in advance @artf ??

artf

Internally, it's a modified version of https://github.com/bgrins/spectrum

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1176June 6, 2018by Abhisheknanda13444633 answers
1 reactions

Style Sectors

hi @artf is there any way to setup style sectors for different devices mobile and desktop i want to disable style sectors in Desktop if style is setup from mobile and other thing as you can see my screenshot i add new button in panel 'view' i m trying to append diff style sectors in this button please help me out @art...

artf

Sorry but there is no built-in configuration for such a thing, the only thing I can suggest is to start with this listener

Abhisheknanda1344463

okie @artf thanks for your suggestion :)

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1101May 10, 2018by kuldeepcis2 answers
0 reactions

apply css property for mobile/tablet view

Hello @artf , https://jsfiddle.net/66cnd2t4/3/ This is the fiddle for the map issue when you drag a map and add it then in dimensions you will see width auto and its label is in pink which shows it user defined means i have passed it in components style block as such , _("map") && i.add("map", { label: n.labelMap, cat...

artf

First of all, next time use this https://jsfiddle.net/szLp8h4n as a starting point for your fiddles, without all the stuff not regarding the issue. To make properties defined on other devices you have to set the CSS on that media query:

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#1079May 1, 2018by Coyote63 answers
2 reactions

Improper Bg Repeat CSS Being Set

When importing components and initializing grapesjs, the css background-repeat property is being changed to background-repeat-x and background-repeat-y, which breaks on iOS. Import components: This is how it looks before: Mobile Desktop Initialize GrapesJs, select an element, and then get the output code, and it comes...

Coyote6

Thanks. I added this to my storage manager function... I think it patches the problem for the time being... I am not quite awake yet, so please let me know if I messed something up.

artf

Thanks @Coyote6 we're already aware of this issue. This happens due to the browser's CSS parser and I can't do much about until there will be a possibility to attach custom CSS parsers, hope to implement it soon.

artf

From https://github.com/artf/grapesjs/releases/tag/v0.14.33 you can use custom CSS parsers, the first to be released is grapesjs-parser-postcss

#922March 2, 2018by mbleverage3 answers
0 reactions

QUESTION: Adding default styling to a component

I have been working on integrating grapesjs into a new development I'm working on. I have had much success with the documentation and wiki forum but am running into a few issues I'm hoping someone out there can help me with. I am working with a mobile view only, I have set the default device to mobile and hidden the o...

artf

Your change on the block doesn't work because you don't change the actual component (just the block's property) With cssComposer instead, by default, selectorManager accepts classes An easier way to add custom CSS might be this one But be...

mbleverage

Thank you! I was able to get that working with: protectedCss: 'img {max-width:100%;}', I have the same issue with videos and iframes (for youtube) being dropped onto the template larger than the screen size and the protectedCss solution di...

artf

protectedCss is loaded so the CSS is here, if it doesn't work probably your CSS technique is not correct

#900February 26, 2018by chthomos2 answers
3 reactions

[QUESTION] Apply styles to all media queries

Again, congratulations on the great job. We have heavily extended Grapes and we managed to add almost all the functionality we need. We plan to use it for mobile first pages. So we have set up the Device manager to default to "Mobile Portrait". Styling is done through classes, and we have extended all components to cr...

chthomos

I figured out how to make it mobile first and it solves my issue for now: Set the editor config.mediaCondition: 'min-width' and on deviceManager: [ {name: 'Mobile portrait', width:'320px',widthMedia:'0px'} {name: 'Tablet', width:'568px',wi...

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#859February 12, 2018by hibuno2 answers
2 reactions

[QUESTIONS] Change canvas style

Hi there, I have some question about canvas style, in this case i have config like this. By default i use css with name builder-desktop.css for default canvas style. And then i want if i change Device Manager and choose mobile, i can change a canvas style to builder-mobile.css. Thank you very much

hibuno

Hi there, Forget it i solve this problem, just add event on change like this. Thank you

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

#814January 29, 2018by vishal50332 answers
0 reactions

[QUESTION] Disable selectable, hoverable and editable options when Mobile view is on.

Hi, I want to disable to select, hover or edit the components of the editor when the Mobile view is on. I have tried using below code. But it removes all the components from the editor. Can you please help me out? Thanks,

artf

Probably because you're passing a collection (wrapperChildren) to updateAll which expects a model

lock[bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.