PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 3,464 个问题
我创建了一个导航插件。我能更改导航组件的背景颜色。 ![截图来自2019-11-11 23-04-47]（https://user-images.githubusercontent.com/48318422/68608241-69a3a200-04d8-11ea-856e-28eaf8fdba7a.png） 正常导航组件 ![截图来自2019-11-11 23-05-21]（https://user-images.githubusercontent.com/48318422/68608318-90fa6f00-04d8-11ea-98f8-88e3d14874de.png） 彩色导航组件 但问题是我无法将CSS添加到悬浮组件（子菜...
你好， 我正在测试为什么某些样式在样式管理器中无法识别，但我找不到，我尝试使用“avoidInlineStyle： true”，但依然无法识别。 以下是示例： https://jsfiddle.net/charles_es/x6yr7z91/28/
chiqui3d
即使我把它设为false，问题依然存在。 https://jsfiddle.net/charles_es/x6yr7z91/33/
pouyamiralayi
@chiqui3d这个[帖子]（https://github.com/artf/grapesjs/issues/404#issuecomment-345253384）可能会有帮助。 干杯！
chiqui3d
我刚意识到，当元素是类时，内联样式就不再被识别了。为什么？
我正在尝试通过 editor.select（editor.DomComponents.getComponents（）.models[0]）。但这并没有起作用。
naveen-15697
@artf，@pouyamiralayi ：I需要在“canvas：drop”事件中满足此条件 editor.on（'canvas：drop'， （）=>{ ... ......// 我选择第一个组件的代码在这里 //... ... })
pouyamiralayi
@naveen-15697 可以通过以下方式实现： 干杯！
naveen-15697
@pouyamiralayi 谢谢！现在它能用了。 @artf，但是，为什么它在“canvas：drop”事件中无法工作？
这是个很愚蠢的问题，但我找不到明显的答案：我是个初学者，已经上过免费的JS共研课程，并且花了很多时间在WordPress上制作和维护网站。我想用开源工具做一个或三个新网站，既能让我自己和终端用户更友好，也能避免那些不必要的复杂和安全漏洞，而我的网站主机总是抱怨WP的那些问题（https://www.helionet.org/index/topic/33983-what-was-the-anonymousfox-hack/）。 于是我开始寻找开源的页面构建器。GrapesJS的界面看起来很棒，但我很难找到其他工具来构建一个真正的网站——我猜应该是嵌入在实际CMS里面的。有没有什么开源的CMS，可以使用grapesJS的，我可以在服务...
artf
我知道 [octoberCMS]（https://octobercms.com/）有这个 [插件]（https://octobercms.com/plugin/pkurg-pagebuilder），也见过其他插件，但记不清名字了 😓
pouyamiralayi
@JpTiger有一些基于 grapesjs 的工具可以帮助你快速设计页面：[语法]（https://github.com/ronaldaug/gramateria）。 其余的可以通过流行的开源且易用的CMS实现，比如[PageKit]（https://github.com/pagekit/pagekit）和[Directus]（https://directus.io/）。我个人更喜欢[Strapi]（https://strapi.io/）;这些都有用户友好的界面，操作过程...
你好， 我发现编辑器依赖于Font-Awesome 4.7库，很多类别都在面板里，图层管理器（fa fa-eye，fa-caret-down），为什么Grapes字体里没有包含这个功能？ 我可以修改面板图标，但不能修改分类，我是说fa-caret-down和fa-caret-right，现在当我加入包含Font-Awesome 5的模板时，一切都会乱。 你知道有什么方法可以更改这些图标吗？
chiqui3d
谢谢，但最好的办法是默认图标是自己的 Grapesjs（用 IcoMoon），然后用户可以选择项目用哪些字体，当然不用依赖版本是 4 还是 5。
artf
嘿，@chiqui3d我一直在等你发的公关 https://github.com/artf/grapesjs/issues/644#issuecomment-421553006 😝 顺便说一句，我建议关闭这个问题，把讨论转到旧的#644 我还想提出一个快速解决方案
pouyamiralayi
嗨@chiqui3d 移除 Font Awesome 目前正在[路线图]（https://github.com/artf/grapesjs/issues/74）。 如果你想升级到 Font-Awesome 5.0，有一个已关闭的 [PR ]（https://github.com/artf/grapesjs/pull/2240）可以帮你。 干杯！
我公司使用 GWT（Google Web Toolkit）来开发一些网页应用。我们有一个独立的 GWT 组件库，用于可重复使用组件。我创建了一个包裹 grapesjs 组件，效果很好。 然而，当我将这个库导入实际项目并添加 grapes 编辑器到屏幕时，除了拖动块到画布之外，其他功能都正常。深入研究 grapesjs 代码后，我发现 没有被调用。不过 会被调用。 也不会被调用。 有没有办法检查什么能阻止拖拽事件触发？这是 函数中唯一的代码： 所以看起来Backbone并没有发布实际的浏览器拖拽事件。 谢谢！
troncoso
谢谢你的信息。不过，我的情况就是因为index.html中的这个原因，这个方法没能正常工作： '''html <body ondragstart=“return false;” ondrop=“return false;”> </body> ``` 移除这些属性后，我的问题就解决了。
pouyamiralayi
@Troncoso你能提供小提琴来复现这个吗？
troncoso
嗯，不太可能。GWT不仅是Java框架，我还在一个GWT项目 grapesjs 过，但没有另一个。我想这个问题很可能会被关闭，但我希望把它当作问题发出来能给我一些建议。这是我需要弄清楚的事情，但我正在寻求一些关于如何排查 grapes 事件的帮助。
看起来“index.html”结构需要是以下内容： '''html <body> <div id=“gjs” style=“height：0px; overflow：hidden”></div> <剧本......> 由于我的自定义样式需要第一个“div”和“main”的存在，而且我尝试更新了“grapesjs.init”的“container”属性但没有成功，所以我想问这是否可行
asieraduriz
我做的是直接克隆这个仓库，然后把“<div id=”gjs“ style=”height：0px; overflow：hidden;“>' 嵌套在另一个 '<div>' 里，所以就像这样 当我运行“npm start”时，我看到的是空白页面
pouyamiralayi
你@fasaas在HTML里明确说明了这一点？ 顺便说一下，确保你的父div是“height：100%”。 干杯！
asieraduriz
如果不行，有没有办法明确表示，当我在 BlockManager 中添加新块时，容器应该是我之前在“index.html”中定义的某个特定容器，而保留原来的 div 在顶层？ '''html <body> <div id=“gjs” style=“height：0px; overflow：hidden”> <div class=“site-content”> <main class=“site-main”> </main> </div> </div> ...
当我尝试使用 urlLoad 时，为什么总是告诉我 400 个错误请求。请帮帮我 ![图片]（https://user-images.githubusercontent.com/30322340/68465815-233b1280-024e-11ea-91ae-e8ab91018bcd.png）
bjccdsrlcr
![图片]（https://user-images.githubusercontent.com/30322340/68470625-65b51d00-0257-11ea-9f16-b3714ab60fb9.png） 我把源代码“get”改成“post”，效果很好。
bjccdsrlcr
@pouyamiralayi解决了。可能是我的后端框架添加了额外的密钥（jsonrpc、id）导致的。 所以我修改源代码，获得实际的 gjs-assets、gjs-components、gjs-css、gjs-html、gjs-styles 的值。然后它就行了 ![图片]（https://user-images.githubusercontent.com/30322340/68521305-b457cb00-02da-11ea-99b0-965d6acab709.png）
bjccdsrlcr
看起来是用 content-type 和 json 来实现的。但没有体现任何价值。而我的后端帧要求在内容类型为json时值。我可以在哪里通过任何参数？
操作系统版本： 1903（操作系统构建：18326.295） 浏览器： Edge（Microsoft Edge 44.18362.267.0） 用户体验： 如果编辑器内的键盘无法访问工具提示，键盘用户将无法理解控制目的，操作时会遇到困难。 繁衍步骤 当用户通过鼠标悬停移动到不同组件时，组件名称会以提示形式显示给用户（图片显示组件图片，文本显示组件文本），但当用户用键盘导航到不同组件时，则不显示工具提示。 实际结果： 键盘用户无法获取通过鼠标悬停显示但通过制表菜单导航时不会出现的工具提示。RTE工具栏也是一样 预期结果： 键盘用户在编辑器中切换到不同组件时，应能看到相应的工具提示信息。RTE工具栏应该正常工作 请找到附图 鼠标悬停显...
artf
我会把所有无障碍问题都指向这里 #654
你好，我想把 Grapesjs 集成到我的 Angular 应用中。 假设我有一个自定义下拉组件（包含.ts、.html和.scss文件），如下所示： CustomDropdown.html---------------------------------- <div class=“cust-dropwodn-container”> <span>某个标题</span> <select ngIf=“shouldDropdownBePresent” class=“select-class”> <option ngFor=“let optionVal of optionsArr”> {{ optionVal.value }} </opt...
Khan-Uzair
有什么新进展@artf？
artf
没有@Khan-Uzair默认情况下，GrapesJS不读取任何框架相关的组件......请阅读更多关于GrapesJS组件的信息[这里]（https://grapesjs.com/docs/modules/Components.html）