#2515January 19, 2020by ikenderham3 answers
Hello Is it possible to only allowing one h1 tag on the every page? I need to make sure that we only can drag one h1 tag into the canvas. What to do? :-)
artf
@pouyamiralayi thanks as always for the huge support ❤️ BTW @ikenderham keep in mind that is correct but only if need to check components as first children of editor.getComponents() (which returns children of the main wrapper) If you need...
pouyamiralayi
@ikenderham cheers!
ikenderham
You are so nice! How can I thank you?? Thanks alot! Khdafesممنون I will try this example tomorrow on work. I just follwed you on github !
#2514January 19, 2020by ghost3 answers
I'm trying to replace the dropdown with icon for the devices following the example in the newsletter template yet it doesn't work.
Phil-B
The above examples didn't work for me in version 0.17.28 (I presume the API has changed). This worked:
umerrinayat
@petervandeput https://github.com/artf/grapesjs/issues/1507#issuecomment-496280105 After grapesjs init. ```// Add device icons on panels bar editor.getConfig().showDevices = 0; editor.Panels.addPanel({ id: "devices-c" }).get("buttons").add...
artf
You should also create those commands https://github.com/artf/grapesjs-preset-newsletter/blob/04f1eb21c1ae45f8d2b2912323e79354d8e72f18/src/commands.js#L30-L44
#2513January 17, 2020by msantore1 answer
I'm using component.find() to search for a nested component in a big chunk of HTML content for a fieldset tag so that I can append components after it. Component.find locates the component, as seen in the console.log, but attempting to .append or use .components to inject content results in a console error: fieldSet.a...
msantore
Figured this out! Just had to specific an array position :-) After using component.find('fieldset') be sure to set an array position fieldSet[0].append(questionFieldSet);
#2512January 16, 2020by eyesurewould2 answers
I'm building a VueJS app and would like to use GrapesJS inside the app (and I'm NOT trying to use VueJS inside GrapesJS). I've searched and read through existing Issues but so far I have not seen any examples of how to use GrapesJS in a VueJS app (unless I'm misunderstanding the examples). Thanks for any suggestions!
pouyamiralayi
Hi @eyesurewould check out #2465 cheers!
eyesurewould
@pouyamiralayi Thanks!
#2511January 16, 2020by ikenderham3 answers
Hello everybody How do i open a selector like general as i select the element. I am new to javascript, but i tried something out like this. what iam doing wrong? Thx for help
artf
@ikenderham you were almost there
simplecommerce
I think you can see a working example here in the source code. https://github.com/artf/grapesjs-preset-webpage/blob/6306f45d9de77b5b60f72679717e10e6081e81be/src/panels/index.js At the bottom.
ikenderham
Can you show me a example, if i click on a DIV then i need general to be opened, or when i click on a h1, then i need to open the "typography"? Thanks alot im new to this.
#2510January 15, 2020by simplecommerce3 answers
Hi, quick question. I have an image and I just want to add a link on it. Using the model, what is the easiest way to add a link on the image? I tried to use model.replaceWith but the problem is that if I put some styling on the image and then call model.replaceWith, the styles are removed. Is there a better way to ach...
simplecommerce
Ok, I was able to get it working by doing the following: I don't know if it's a good way or not, appreciate any feedback.
pouyamiralayi
Hi @simplecommerce ! cheers!
simplecommerce
Hi @simplecommerce ! cheers! Hi @pouyamiralayi, thanks for the reply. I didn't mean by creating a new component, what I meant was to simply replace a rendered component model in the canvas (an image) by wrapping it inside a link (a) while...
#2508January 14, 2020by alexiswbr3 answers
This bug is also on the online demo : https://grapesjs.com/demo.htmlAdd a Text Block to the page, start typing and hiting enter to make several break lines.Unselect the block.Double click on the block to start editing again. Now if you click on the "view code" button, you will see that the HTML nodes inside the Text B...
artf
Ok I'll try to check this out
pouyamiralayi
@alexiswbr using the below snippet, the `div's will become br`'s as the expected behaviour:
obrazkow
I use such way to prevent transformation to component and keep original html. Just override component that you need, for example text or create new. Maybe it's not good solution, but it works :)
#2507January 13, 2020by ghost2 answers
Hi I am using grapesjs in a project that uses proportional scaling everywhere. based on your advice, I can now default the font size selectors to 'em' and make 'em' the only option. editor.on('load', function () { const styleManager = editor.StyleManager; //force font-size to EM const fontSize = styleManager.getProper...
artf
Can you create a reproducible demo?
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...
#2506January 13, 2020by andrewryan19063 answers
I'm using GrapesJs with Angular and am extending the functionality using Angular components. So my template looks like this: This all works fine; I've added DomComponents to the designer, and the components show up in the layer designer and I can even change traits with no problem. Everything renders as it should. How...
andrewryan1906
So, What I ended up doing instead is using Angular elements, but NOT compiling the elements into a web component (wanted to avoid the extra complexity). This kept me from having to switch out the DOM elements, and so GrapesJS editor is pla...
andrewryan1906
This might help. As part of processing the element, I'm swapping it out with my Angular element on the fly... so, after rs-wc-custom-component tag is rendered, I wait 1 ms and generate a dynamic Angular component, and swap out the rs-wc-cu...
artf
As part of processing the element, I'm swapping it out with my Angular element on the fly... so, after rs-wc-custom-component tag is rendered, I wait 1 ms and generate a dynamic Angular component, and swap out the rs-wc-custom-component wi...
#2505January 12, 2020by vfxdude3 answers
The layer manager is currently hidden away in a tab, but it should in my opinion be visible all the time. Webflow also had it hidden away in a tab, but moved it to the left side. https://webflow.com/feature/new-navigator-location
pouyamiralayi
@vfxdude please check out this fiddle for custom UI (also the layers panel is on the left side). cheers!
vfxdude
@pouyamiralayi thanks. I was fiddling with a similar idea myself. https://codepen.io/neocoder/pen/bGNMyQK (using the Webpage Preset plugin ). It would be better and easier if there was an option for this in the Webpage Preset plugin though.
artf
It would be better and easier if there was an option for this in the Webpage Preset plugin though. Currently, I can't dedicate time to presets, but PRs are always welcome