问题标签 [wordpress-gutenberg]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
653 浏览

wordpress - WordPress Gutenberg RichText 不显示 HTML

如下面的代码片段所示,我试图将 HTML 或 JSX 附加到 RichText 内容是徒劳的。

我想知道为什么updateContentWithString()工作正常但updateContentWithHTML()根本不起作用。

请指导我。

谢谢

0 投票
1 回答
2293 浏览

wordpress-gutenberg - 如何在 WordPress Gutenberg 插件的 div 中包装块元素

我写信是想看看是否有更“WordPress”的方式来包装在 WordPress 中使用 Gutenberg 创建的块。

到目前为止,我的方法是使用“HTML 块”添加一个打开的 div,然后创建该块,最后,我用另一个 HTML 块关闭该 div。

这是在 div 中包装块元素的可接受方式吗?我的方法可以按我的意愿工作,但我想知道是否有我没见过的推荐替代方法?

0 投票
2 回答
1899 浏览

wordpress - Gutenberg 块:如何将 RichText 添加到无序列表

我正在尝试创建一个自定义 Gutenberg 块,该块将具有多个 RichText 组件的无序列表。

最终结果将是这样的:

<ul> <li> <span class="class-one">First item</span> <span class="class-two">Second item</span> </li> </ul>

我一直在玩这个WordPress 教程中的食谱卡示例

我可以看到 RichText 组件如何多行以实现“li”作为获取列表的标签,但我不知道如何使用子 Richtext 组件进行多行。

这是我到目前为止所拥有的:

我认为问题是应该将第一个 RichText 切换为其他内容,但我不知道将其更改为什么仍会将所有内容显示为列表。我尝试删除第一个 RichText 并将其设置为带有“li”标签的“ul”,然后编辑器显示第二个 RichText,但它没有将其显示为列表。

任何帮助是极大的赞赏。

0 投票
0 回答
1874 浏览

json - 在 Gutenberg InspectorControls 中使用 ajax 数据

我正在创建自定义 Gutenberg 编辑器块以将 YouTube 视频 ID 设置为<button>属性data-video=""

更新 - 在下面添加了工作代码

我的function.php代码

我的 block.js 代码

我的 editor.css 代码

在后端我得到了这个结果: 在此处输入图像描述

一切正常,但现在我需要通过 ID 从 YouTube 获取视频的标题和持续时间getId(attributes.url)并插入到 InspectorControls 块。

如果我尝试使用 Ajax 获取标题和持续时间,首先将所有块字段呈现给 InspectorControls,然后执行我的 ajax 请求。我在ajax成功时需要类似的东西push( el( 'p', {}, '**YouTube Title**') )

告诉我如何在渲染和更改后将使用 Ajax 获得的信息添加到 InspectorControls?

0 投票
1 回答
447 浏览

javascript - 从 Gutenberg SelectControl 获取价值到前端的 php

我有简单的古腾堡块和谷歌字体选择。

php:

我只需要从谷歌加载选定的字体。

如何从选择中获取 val ?

0 投票
1 回答
48 浏览

wordpress - 从 3.6.2 升级到 3.7.0 后 Gutenberg 块抛出错误

我创建了一个从 CPT 中提取内容的块。在我从 Gutenberg 3.6.2 升级到 3.7.0 之前,我没有任何错误,并且在 Gutenberg 编辑器中一切正常。我浏览了 3.7.0 更新日志,乍一看没有任何问题。

控制台中抛出的错误:

相关代码:

有任何想法吗?提前致谢。

0 投票
1 回答
379 浏览

jsx - 古腾堡块获取最近的页面

基于用于检索最近的帖子块的动态块示例,我正在尝试创建一个检索页面的块。

在我更改的 php 服务器组件中:

至:

并得到一个 php 错误日志:

致命错误:未捕获的错误:无法使用 WP_Post 类型的对象作为 mysite 中的数组....:24

  1. render_block_latest_pages(Array, '') /mysite/wp-content/plugins/gutenberg/lib/class-wp-block-type.php:108
  2. WP_Block_Type->render(Array, '') /mysite/wp-content/plugins/gutenberg/lib/blocks.php:238
  3. do_blocks('') /mysite/wp-includes/class-wp-hook.php:286
  4. WP_Hook->apply_filters('
  5. apply_filters('the_content', '
  6. the_content() /mysite/themes/bt-sass-blank-theme/template-parts/page/content-default.php:7

我也尝试了一个正常的查询,但它不起作用。Gutenberg 使用 Wordpress REST API,不确定是否存在问题。

0 投票
3 回答
955 浏览

wordpress - Restrict Gutenberg Editor for custom post type wordpress

I need to create my own custom post type and want to limit Gutenberg editor for my post type(only) and use WordPress editor in this post type. how can limit this plugin for my cpt??

thanks

0 投票
1 回答
4269 浏览

javascript - 检查控件中的古腾堡媒体上传

我正在尝试通过 Gutenberg 的 Inspect Control 的媒体库上传文件。我目前在 JS 中使用此代码:

在这里我正在注册块类型:

但由于某种原因,它对我不起作用。在控制台中它给了我这个错误:

错误:缩小的 React 错误 #130;访问 https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=undefined&args[]= 获取完整消息或使用非缩小开发环境获取完整错误和其他有用的警告。

当我点击块时,它说:

编辑器遇到了意外错误。

任何人都可以帮助我吗?

0 投票
0 回答
248 浏览

wordpress - How to fix Gutenberg's Convert to Blocks?

When I update something in my Gutenberg's JS code and save it, that block is broken in all of my posts wherever it is used and following error is being displayed:

enter image description here

Can you please let me know how to fix this error (without removing and re-adding block as a fix because I might have 100+ posts!)