WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdDo a quick SEARCH first, to see if someone else didn't open the same issueAll relative statements/questions have to be filled/answered, otherwise, th...
WARNING READ and FOLLOW next 3 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.mdDo a quick SEARCH first, to see if someone else didn't open the same issueAll relative statements/questions have to be filled/answered, otherwise, th...
Hi, We are using some Twig template features in our grapesjs implementation. like: {% if variable == "value" %}<b>text</b>{% endif %} But due to the toHtml() function in src/dom_components/model/ComponentTextNode.js this gets converted into {% if variable == "e;value"e; %}<b>text</b>{% endif %} Is there an eas...
artf
Yeah sure, you can extend the textnode component and use your toHTML function
Hello @artf , For free dragging, we are using dragMode: 'translate'. When we're moving all components from bottom to top position, it remains some blank space at end of the page and browser shows scroll, although we don't have any content at end of the page. See screenshot - For better understanding, you can watch the...
artf
This is how translate mode works, the absolute mode doesn't leave any empty space
this button is currently off by default. so you have to turn it on every time, which is not obvious to everyone. how do you make it active right away?
mcottret
Hi @Enmaboya ! Looking at the default Panels configuration, it should be active by default. If you have a custom panels configuration, you need to add the active: true property to the button's configuration (like here). Alternatively, you...
ghost
@mcottret thank you so much!
sdchamoli
In Angular myPlugin: any; this.myPlugin = editor => { editor.Panels.addPanel({ id: 'basic-actions', el: '.panel__basic-actions', buttons: [ { id: 'visibility', active: true, // active by default className: 'btn-toggle-borders', label: '<u>...
I have a project that requires a form, currently using the form plugin, and each element of the form requires a name. While this is a trait, is it possible to require a trait and check all nodes to determine if they meet their requirement? Following my example one would create a form where the nodes have a required tr...
artf
What you see in the documentation it's just about the required attribute (eg. <input ... required/>), so nothing blocks the user from storing the template. In your case, you can create a kind of check before storing which queries all the f...
Hi, i succeed to create a new type containing a clickable image. But unfortunaltely, the new custom type isn't recognize by the HTML parser on import. Here is my new type source code : editor.DomComponents.addType('imagelink', { isComponent: el => { if (el.tagName === 'DIV' && (typeof el.classList !== 'undefined' && e...
Lerdouille
Hi, for the record, when i try to change the isComponent return, with a type defined in a plugin like this : isComponent: el => { if (el.tagName === 'DIV' && (typeof el.classList !== 'undefined' && el.classList.contains('imagelink-class'))...
Lerdouille
Another curiosity which might be logical... If i tried to put a exotic isComponent function like this : if (el.tagName === 'ABCDE') { return { type: 'imagelink' }; } And when i try to import this html text : <abcde>test</abcde> The plugin...
artf
I think you're missing the point of components. You have a custom one (imagelink) and then an inner one (img), so the editor shows it, so I see no issues here. To see the traits from the custom component you have to select it and it has no...
Newbie question here, I added the plugin grapesjs-style-bg to the stack, now how to I show it in my StyleManager? I reset all the sectors from the StyleManager on initialization, and then I add them one by one using styleManager.addSector("id", {...}).
hellocaio
@pooriamo, thanks man! Life saver! It works great! :))) Thanks for the cheatssheet too, lots of goodies in there!
pooriamo
You can cheat from here: https://github.com/artf/grapesjs/blob/gh-pages/demo.html#L1127 You must add background-bg to the buildProps array and then config it in properties, the type must be bg:
Hello @artf i am working with that awesome tool for long time i integrate it with react , and create a react plugin component for it , and create custom trait to get data from api and render it throw the plugin , i setup a local storage and also make a button to save all data in the local storage and db but i have a l...
artf
For sure you didn't configure correctly the Storage Manager Please read carefully this guide https://grapesjs.com/docs/modules/Storage.html
i3laddin
thanks @artf for answer , i know how much time is important to you , but sorry for that , i configure it correctly , also i am get 200 for post request , also i get all of html and components and css for load request , but i have a little...
Hey man, once again, great work on the GrapesJS, you are getting tons of things done, it is incredible! So, my question is, how can I add multiples CSS properties with just one button on the StyleManager? What I want to add is a display: flex; justify-content: center, the way we have right now that I found on the docu...
Ju99ernaut
At the moment I don't think you can do that with the StyleManager it may be easier to use traits
artf
Yeah, unfortunately, @Ju99ernaut is right! Probably soon I'll start working on the StyleManager API which would allow a similar level of customization we have in Traits