PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验

GrapesJS 问题

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

找到 3,464 个问题

#29982020年9月3日作者 svalenciano813 个回答
0 个反应

在[寻求帮助]中插入HTML+CSS内联

我在 grapesjs 里内置了漂亮的ckeditor 4编辑器，包含以下组件： grapesjs： 0.15.8 grapesjs-preset-newsletter： 0.2.20 ckeditor.js：4 grapesjs-plugin-ckeditor - 0.0.9 我的项目生成新闻通讯（HTML + CSS），存储在数据库中。这份通讯可以编辑并多次保存。 编辑完成后，可以通过Gmail发送。 我的问题是：用户生成新闻通讯（html + css），并保存为“html + css”内联格式; var htmlWithCss = editor.runCommand('gjs-get-inlined-html');这些数据被...

Abhisheknanda1344463

你好@svalenciano81你试过这个吗？ 'var cmdGetCode = cmdm.get（'gjs-get-inlined-html'）;'

svalenciano81

你好@Abhisheknanda1344463 我需要反向的过程。我把代码放在内联里，需要把它分成组件和样式。

artf

要重新加载模板，你不应该用HTML/CSS，你必须存储并加载JSON的 https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates

查看详情
#29962020年9月3日作者 kAvItHa-cL1 个回答
0 个反应

模态定制

你好， 有没有可能自定义模态的显示方式，比如Visual Studio里的属性窗口？与其显示开放模态，焦点应显示窗外细节

artf

我觉得在这种情况下你不应该用modal，你可以创建面板/div，在组件选择时设置监听器“component：selected”，然后渲染你的属性

查看详情
#29952020年9月3日作者 jayeshmotwani2 个回答
1 个反应

问题：浮点左/右浮点是从容器中移除组件

我观察到每当我将组件向左或向右对齐（float left 或float right），该组件会从父容器中出来，但如果我把它调到“无”，它又会回到容器内的最后一个位置。我在现场演示中也发现了这个问题。 请参考附上的截图 ![Grapes JS 在对齐前]（https://user-images.githubusercontent.com/27188013/92104326-c7560180-edfe-11ea-96b5-20c8f0928a37.png） ![Grapes JS 对齐后 ]（https://user-images.githubusercontent.com/27188013/92104317-c3c27a80-edf...

Ju99ernaut

float 属性会折叠父 div。你可以用[这个]（https://css-tricks.com/all-about-floats/）作参考。

artf

是的，不幸的是，花车的运作方式就是这么奇怪，所以如果你为非技术人员设计的建造者，最好避开那个地产 😬

查看详情
#29912020年9月2日作者 Abhisheknanda13444633 个回答
3 个反应

Editor.getSelected（） 给了我未定义的状态。

你好@artf我想在特定的链接特征上添加动态页面。 这是我用的。 'const component = editor.getSelected（）; component.getTrait（'link'）.set（'options'， [ { 值： 'opt1'， name： 'New option 1'}， { value： 'opt2'， name： 'New option 2'}， ]); ` 这导致控制台中组件未定义，因为默认情况下没有选择任何元素 你能帮我指点一下吗？我想在点击链接时把那个页面附加到链接特征列表里

Ju99ernaut

你可以先检查'component.getTrait（'href'）'是否能获得什么： “''js editor.on（'component：selected'， component => { component.getTrait（'href'） && component.getTrait（'href'）.set（'options'， data.list）; }); ```

Abhisheknanda1344463

非常感谢@Ju99ernaut 现在，它运行得非常完美。 非常感谢你的帮助。 结束这个问题。

Ju99ernaut

你可以用以下方法为每种组件类型添加： “''js const components = 编辑器。Components.getTypes（）; components.forEach（component => { 操控这里的特质...... }); ```

查看详情
#29902020年9月1日作者 Joshmamroud3 个回答
0 个反应

提问：有没有办法使用同一风格属性的不同变体？

注意：这是在风格管理器的背景下。 有没有办法使用同一风格属性的不同变体？ 例如，当我在非文本节点组件上使用文本对齐属性时，我希望标签显示为“对齐内容”，并有“左”、“右”和“中心”选项。然而，当文本节点显示“文本对齐”属性时，我希望标签显示为“对齐文本”，并有“左”、“右”、“居中”和“对齐”选项。 我在GitHub上查过文档和相关问题，但似乎找不到任何答案。 有人知道怎么实现吗？ 提前感谢大家！

Ju99ernaut

我觉得用API做不到，另外“文本对齐”对非文本组件有效吗？你可能需要使用“flexbox”中的“align-content”属性

artf

你应该尝试用Component的'styleable-require'属性来显示特定的style属性（标记为'toRequire'），并用'unstylable'显示不需要的属性。 “''js 编辑。Components.addType（'...'， { 型号：{ 默认值：{ 'styleable-require'： ['align-content']， 不可样式化：['text-align']， } } }); 在你的StyleManager配置中 buildProps：...

Joshmamroud

@artf 感谢你的回复。 在这种情况下，使用带有flex列和行的“align-content”属性时，我仍然会遇到问题。对于列，我希望选项分别为：“顶部”、“中心”、“底部”;对于行，我希望选项分别是：“左”、“中”、“右”。 我的用户对CSS不太熟悉，更别说Flexbox了，使用“Start”、“Center”和“End”这样的操作体验不会像我希望的那么好。 你还有其他建议吗？ 谢谢你， 乔什

查看详情
#29892020年8月31日作者 Abhisheknanda13444632 个回答
0 个反应

如何在自定义div中添加按钮

你好@artf有没有办法像我们添加样式管理器那样，在自定义div中附加所有grapesjs的默认按钮？ 给你 [https://codepen.io/artf/pen/MQpZPj]（网址） 谢谢

artf

正如示例所示，你可以通过“el： '#'' 选项指定面板目标，这样应该能包含你的按钮

Abhisheknanda1344463

你好@artf请您确认一下这个方向的面板：{ ID：“选项”， EL：“#blocks'}' 我试过了，但这不起作用 还是我需要为我的新面板重新创建新的按钮？ 难道我漏掉了什么？ 提前感谢大家

查看详情
#29882020年8月31日作者 Abhisheknanda13444631 个回答
0 个反应

尝试覆盖链接特性

你好@artf我正在尝试添加新的特质类型，下面是我的代码。它在代码中也更新了数值，但重新加载链接时，特性会被设置为默认。 这是我的代码 “编辑。DomComponents.addType（'link'， { model： dModel.extend（{ defaults： Object.assign（{}， dModel.prototype.defaults， { 可移除：错误， 特质：[ 字符串会自动转换为文本类型 { 类型：“选择”， 标签：“Pages”， 名称：“Href”， 变革提案：1， 选项：[ {值：“index.html”，名称：“Home”}， {value： 'index2.html'， name： 'Hom...

Abhisheknanda1344463

在插件里输入代码后，它就成功了。

查看详情
#29872020年8月31日作者 thusharaprimus2 个回答
0 个反应
需要更多信息

XX 语言支持

需要支持阿拉伯语。

artf

你想创建一个永久居民吗？

no-response[bot]

由于我们请求原作者提供更多信息未获回应，本期已自动关闭。仅凭当前期刊中的信息，我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案，请随时联系我们，以便我们进一步调查。

查看详情
#29862020年8月31日作者 FlowingCloudRTL1 个回答
0 个反应

BUG：Addframe方法无法与组件道具相匹配

版本： "0.16.18" 你能重现演示中的bug吗？ [X] 是的 [ ] 不 在网页构建演示中复现该漏洞的步骤： 打开演示和控制台，进入 “编辑。Canvas.addFrame（{ 名称：“移动主页”， x：100，// 画布位置 y：100， 宽度：500，// 框架尺寸 身高：600， 设备：“设备-ID”， 组成要素： [ '<h1 class=“testh”>标题框</h1>'， '<p class=“testp”>段落框架</p>'， ], 风格： .testh { 颜色：红色; } .testp { 颜色：蓝色; } , }); 预期结果： 创建一个包含相应组件的iframe 漏洞： ![图片]（https://u...

artf

感谢@FlowingCloudRTL的报告，但多帧功能还远未完成，所以我对这些问题并不感到惊讶。如果有人有兴趣进一步推广这个功能，请告诉我

查看详情

浏览所有主题