Hello. I'm from Brazil and I'm sorry for the bad English. How do I create a new button with a custom event on the toolbar relative to the selected element? Igual ao que remove o elemento selecionado.
ShepelE
I don't understand some words, but if you want to remove selected element, you can use SelectionManager : if you need to create a new button, you can use guide https://github.com/artf/grapesjs/wiki here - create panel, then button, then co...
fabianomiranda
Thank you very much for responding. I want to create a new button on the toolbar when selecting an element.
How we can save HTML without using editor.getHtml() and replace function. As, when we are using this in image upload then the existing video element html are removed. Please help us to do save image and video data dynamically using backbone or some other solution.
ateshuseyin
You can create your own storage to handle whole data in the editor (html, css, assets etc) HTML part only contains links of assets (image, video etc). If you want to get uploaded data you should override uploadFile method of AssetsManager
Deepak813
Hi @ateshuseyin, Thanks for the message. I don't know how to create our own storage.Please elaborate how to do that as i am in the middle of the this tasks and not able to go further. editor.replace(); refresh the complete html of browser...
artf
@Deepak813 this is highly discussed argument, so just make a search in issues (eg. #597)
Guys I need to trigger some action after removing editor's components. Is there any way to do so? Or have I to write my own trigger?
ateshuseyin
There is not an event related with your requirement. You can easily override tlb-deletecommand. I created a sandbox for you https://codesandbox.io/s/k2yoxjjr95. If you want to handle programatically removed components, I don't know how to...
AH1N1
That's exactly what I've been looking for :) Thank you! I wrote 'after' but I should have written 'when' ;)
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.
is there way to have conditional traits? if is current component is youtube video then have some traits and if video is non-youtube then shows other traits?
ryandeba
Hi @krunal039, The video component seems to do this already to some extent - see here. If you want to customize the traits further, you could probably do something like this (untested code, but copied and modified from something similar th...
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.
Not technically an issue but I'm looking for a way to replicate the "code editor" feature in Click Funnels, where there is a block that opens an editor. Don't want to start getting too creative as I think there is a way to do this inside grapesjs (probably). If not I can start writing one, but thought I should check b...
NorthstarTech
https://github.com/ryandeba/grapesjs-html-block. check out this plugin. It helped us to write our own block that provides a similar function but with HTML.
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.
Did we get the Custom HTML type in video traits so that user can able to enter the iframe code and it will embed in the html. As,all the famous editor have this feature which is common one in video category. Is this video traits is in roadmap. As we have created this new component but that conflicts with the existing...
ryandeba
Hi @Deepak813, This doesn't really sound like a video component to me if you let users enter in whatever iframe code that they want. If the component lets you enter custom "iframe code", it seems like it would also let them enter some non-...
Deepak813
Hi @ryandeba, Thanks for the message. The exact scenario in Custom HTML type in video is very simple.If user enter any non-iframe HTML then we will display the error message just as shown in vimeo video type or if user enter any iframe HTM...
ryandeba
Thank you for the additional details @Deepak813 - I think I have a better idea of what you're trying to accomplish now. I would still be interested in seeing an example if you have one available. In the meantime, I will give some thought i...
Hi I want to add new devices with both width and height, Is there any way I can do this? An other issue is that when I give width of device in inches instead of pixels then its margin property of editor does not work. Please help me on this. Regards
artf
Hi @attaalive I'll add the possibility to set the height of devices in the next release. Honestly, I don't get what do you mean by its margin property of editor does not work
attaalive
Hi thanks for your response. I have added a device with width and height. I have given the size of device in inches instead of pixels. Now Margin,Padding and positioning is not working. Please see the screen shot below. Regards
artf
@attaalive can you provide a live example (eg. jsfiddel)? Your screenshot is ambiguous on what exactly is not working
Drag component to canvasDon't release mouseDrag back to blocks panelComponent is still applied to canvas It should instead cancel
artf
Drag back to blocks panel Honestly, never seen kind of UX... why not the classic Esc? (which works already)
artf
@Geczy Now blocks support HTML5 D&D https://github.com/artf/grapesjs/releases/tag/v0.13.5
Geczy
This is a very common UX anywhere you go https://w3c.github.io/html/editing.html#drag-and-dropHowever it is implemented, drag-and-drop operations must have a starting point (e.g., where the mouse was clicked, or the start of the selection...
Hi, I'm trying to read the HTML and CSS from my database. When I try to load it into the editor, nothing displays. I can store the data just, just cannot load it. Is this the correct format for the data when you are loading it? Content-type Preview Response
DeathStapler
So when I set: contentTypeJson: true, resulting in: I can now load from the database. But, now it will not save, because it is sending the data as JSON. How can I send the data as POST variables, but receive it as JSON?
artf
@shareefhiasat I explain here how to use them https://github.com/artf/grapesjs/wiki/Storage#store-and-load-templates
duskhacker
@DeathStapler This is what mine looks like: The thing that jumps out at me at first is that assets, components and styles should be arrays, you have empty strings. The Content-Type is correct.
Hi there, I solved this using the following configuration: grapesjs.init({ colorPicker: { appendTo: 'parent', offset: { top: 26, left: -166, }, }, }) Maybe you need to adjust the top and left positions for you, because I changed some sizes...
swarnat
I had exactly the same problem and thanks to your pointer to ColorPicker.js I was able to fix. Like artf say, the calculation of position is wrong, when editor is shown with a popup, like bootstrap modal. So I replaced the correction lines...
artf
Are you able to provide a live example of the issue? (jsfiddle, codepen, etc..)