GrapesJS 问题

已收录 3,464 个 GitHub 问题 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。

找到 1,399 个问题

🔍 outdated
#6072017年12月5日作者 fabianomiranda3 个回答
0 个反应

新增工具栏元素

你好。我来自巴西,抱歉英语不好。 我如何在工具栏上创建一个新的按钮,并且在工具栏上针对所选元素设置自定义事件?Igual ao que remove o elemento selecionado.

ShepelE

我不太懂一些词,但如果你想移除选中的元素,可以用 SelectionManager: ![25](https://user-images.githubusercontent.com/16486717/33655652-55ef9b52-da7c-11e7-8035-1b7555dcdee7.png) 如果你需要创建一个新按钮,可以用这里的指南 https://github.com/artf/grapesjs/wiki——创建面板,然后按钮,然后命令这个按钮......

fabianomiranda

非常感谢你的回复。我想在选择元素时在工具栏上创建一个新按钮。

artf

你好,Fabiano,请在这里查看 #266

#6052017年12月4日作者 Deepak8133 个回答
0 个反应

我们如何保存HTML

我们如何在不使用 editor.getHtml() 的情况下保存 HTML,并替换函数。 因为在图片上传中使用时,现有的视频元素 html 会被移除。 请帮我们用Backbone或其他解决方案动态保存图像和视频数据。

ateshuseyin

你可以自己创建一个[存储](https://github.com/artf/grapesjs/wiki/API-Storage-Manager),在编辑器中处理整数据(html、css、资源等)。 HTML部分只包含资源链接(图片、视频等)。如果你想上传数据,应该覆盖 AssetsManager 的 uploadFile 方法。

Deepak813

你好@ateshuseyin, 谢谢你的留言。 我不知道怎么自己创建存储空间。请详细说明怎么做,因为我现在正忙着做这些任务,无法继续。 editor.replace();刷新浏览器的整个HTML是因为视频元素无法正常工作,因为所有视频HTML都被移除了。 请帮我们解决这个问题。

artf

@Deepak813这是一个备受讨论的论点,所以你可以在期刊中搜索(例如#597)。

#6042017年12月4日作者 AH1N13 个回答
0 个反应

移除组件后的触发

伙计们,我需要在移除编辑器组件后触发一些操作。有没有办法做到这一点? 还是我得自己写触发点?

ateshuseyin

没有与您的要求相关的事件。你可以轻松覆盖'tlb-delete'命令。我为你创建了一个沙盒 https://codesandbox.io/s/k2yoxjjr95。 如果你想处理程序中移除的组件,我不知道怎么做。你可以为它创建一个新的沙盒。

AH1N1

这正是我一直在找的:)谢谢! 我写的是“之后”,但我本该写“当”;)

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#6032017年12月4日作者 krunal0392 个回答
1 个反应

条件性状

有没有办法设置条件性质?如果当前的组件是YouTube视频,那么就有一些特征;如果视频是非YouTube的,那么会显示其他特征?

ryandeba

你好@krunal039, 视频部分似乎已经在一定程度上做到了这一点——参见[这里](https://github.com/artf/grapesjs/blob/ea7dca4e5ed486658685bff832e9a5a9561e4d00/src/dom_components/model/ComponentVideo.js#L177)。如果你想进一步自定义特质,可以做类似这样的操作(未经测试的代码,但复制并修改自我做过的类似内容):

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#6022017年12月2日作者 michaellwatson2 个回答
2 个反应

自定义HTML/JavaScript

技术上来说这不是问题,但我正在寻找一种方法来复制Click Funnels中的“代码编辑器”功能,那里有一个模块可以打开编辑器。 不想太有创意,因为我觉得葡萄里应该有办法做到这一点(大概有)。 如果不行,我可以开始写,但觉得还是先检查一下最佳实现。 提前感谢大家 ![图片](https://user-images.githubusercontent.com/6263630/33519842-38624814-d7a7-11e7-9522-e8da5edfec42.png) ![图片](https://user-images.githubusercontent.com/6263630/33519844-495fb78c-d7a7-1...

NorthstarTech

https://github.com/ryandeba/grapesjs-html-block。 看看这个插件。它帮助我们编写了自己的模块,提供了类似的功能,但用了 HTML。

lock[bot]

由于关闭后没有近期活动,该帖子已被自动锁定。请为相关漏洞开启新一期。

#6012017年12月2日作者 Deepak8133 个回答
0 个反应

视频特征中的自定义HTML类型

我们有没有在视频特性中加入自定义HTML类型,这样用户就能输入iframe代码,它会嵌入HTML中? 因为所有知名剪辑师都有这个功能,这在视频类别中很常见。 这个视频特质在路线图中吗? 因为我们创建了这个新组件,但它与现有的视频特性冲突。

ryandeba

你好@Deepak813, 如果你让用户输入任何他们想要的iframe代码,这听起来不像是视频组件。如果组件允许你输入自定义的“iframe代码”,看起来它也会允许输入一些非iframe的HTML(“<div>foobar</div>”),甚至是不指向视频的有效iframe的HTML('<iframe src=“http://github.com”></iframe>')。你想如何防止这种情况?你有其他编辑的例子可以链接吗?我很想知道这些是怎么运作的,也许是我没想清楚。 你...

Deepak813

你好,@ryandeba, 谢谢你的留言。 视频中自定义HTML输入的具体场景非常简单。如果用户输入任何非iframe的HTML,我们会显示错误信息,就像vimeo视频类型所示;或者如果用户输入任何指向视频的iframe(<iframe src=“http://github.com”></iframe>),那么无论src有效还是无效,iframesrc都会显示该错误。如果是有效的src,则显示视频;如果无效,则显示空白iframe。 此外,由于我们在模板构建器中为用户提供了...

ryandeba

感谢你补充的细节@Deepak813——我现在对你想实现的目标有了更清晰的了解。如果你有范例,我还是很想看看。与此同时,我会考虑如何实现这一点。

#5992017年12月1日作者 attaalive3 个回答
0 个反应

设置设备高度和设备宽度

你好,我想添加宽度和高度的新设备,有什么办法可以实现吗?另一个问题是,当我用英寸给设备宽度而不是像素时,编辑器的边距属性就无法正常工作。请帮帮我。 此致

artf

你好@attaalive我会在下一个版本中添加设置设备高度的功能。说实话,我不太明白你说的“编辑的边缘属性不起作用”是什么意思

attaalive

你好,谢谢你的回复。我添加了一个宽度和高度的设备。我用英寸来表示设备的尺寸,而不是像素。现在,边距、填充和定位都不起作用了。请看下面的截图。 ![葡萄味](https://user-images.githubusercontent.com/6896243/33711713-c17eb17e-db66-11e7-85e1-8349ed6b6cf6.png) 此致

artf

@attaalive你能举个实时例子吗(比如jsfiddel)?你的截图对具体哪里不起作用有模糊说明

#5982017年11月30日作者 Geczy3 个回答
2 个反应

吸烟不能“取消”

将组件拖拽到画布不要松鼠拖回方块面板组件仍然应用到画布上 它应该取消

artf

'3.拖回方块面板' 说实话,我从没见过那种用户体验......为什么不用经典的“Esc”呢?(这已经能用了)

artf

@Geczy 现在块支持 HTML5 D&D https://github.com/artf/grapesjs/releases/tag/v0.13.5 ![拖拽](https://user-images.githubusercontent.com/11614725/34922228-463a34ee-f98d-11e7-9ca6-06e65b0c2741.gif)

Geczy

这在任何地方都很常见的用户体验 https://w3c.github.io/html/editing.html#drag-and-drop无论实现方式如何,拖放操作必须有起点(例如鼠标点击的位置,或被选中的元素的起点),可以有任意数量的中间步骤(鼠标在拖动过程中移动的元素,或用户在循环选择时选择的可能丢弃点), 并且必须有一个终点(鼠标按钮松开的元素,或最终被选中的元素),或者被取消。终点必须是掉落发生前最后被选为可能丢弃点的元素(因此如果操作未被取消,中间步骤中至少有一个...

#5972017年11月30日作者 DeathStapler3 个回答
2 个反应

StorageManager:从远程存储加载

你好, 我正在尝试读取数据库中的HTML和CSS。当我尝试加载到编辑器时,什么都没有显示。 我可以存储数据,但就是加载不了。 加载数据时,这种格式是正确的吗? 内容类型 预告 回应

DeathStapler

所以当我设置: 'contentTypeJson: true, ' 结果为: 我现在可以从数据库加载了。 但现在它无法保存,因为它以 JSON 形式发送数据。 我怎样才能把数据发送成POST变量,但接收到的是JSON?

artf

@shareefhiasat我在这里解释如何使用它们 https://github.com/artf/grapesjs/wiki/Storage#store-and-load-templates

duskhacker

@DeathStapler 这是我的长相: 一开始让我注意到的是,资产、组件和样式应该是数组,而字符串是空的。 “内容类型”是正确的。

#5962017年11月30日作者 TrungPham3833 个回答
9 个反应

颜色选择器显示错误位置

![添加](https://user-images.githubusercontent.com/34128438/33429645-48a8e104-d600-11e7-8800-2b237284da92.png)

fguslinski

你好,我用以下配置解决了这个问题: 'Grapesjs.init({ colorPicker: { 附录:'父', 偏移:{ 顶部:26,左:-166, }, }, })` 也许你需要调整一下上下两个位置,因为我改了一些尺寸。但在这里效果非常好。

swarnat

我遇到过完全一样的问题,多亏了你提供的ColorPicker.js我终于解决了。 就像artf说的,当编辑器弹出时,位置的计算是错的,比如Bootstrap Modal。 所以我把修正线[这里](https://github.com/artf/grapesjs/blob/46196a1e90af1514719e123c8038cc3fa93f1a81/src/utils/ColorPicker.js#L1098)替换成这样: “JavaScript offset.left...

artf

你能举个具体例子说明这个问题吗?(jsfiddle、CodePen等)

浏览所有主题