您的浏览器需要启用 JavaScript 才能正常访问此网站。
萨龙网络
登录
首页-WordPress文章-WordPress-正文

WordPress 如何根据文章类型向编辑器添加 CSS

萨龙龙萨龙龙WordPress3年前002.29W
在 WordPress 中,我们可以通过向主题中添加 CSS 文件来为页面和文章添加样式。但是,如果您希望根据文章类型添加自定义样式,该怎么办呢?在本文中,我们将介绍如何在文章编辑器中添加自定义 CSS 样式,以根据文章类型为区块编辑器添加样式。 步骤 1:创建一个新的 CSS 文件 首先,我们需要创建一个新的 CSS 文件,其中包含我们想要为区块编辑器添加的样式。将该文件命名为 custom-editor-style.css,并将其放置在您的主题文件夹中的任何位置。 步骤 2:将 CSS 文件链接到主题 接下来,我们需要将 CSS 文件链接到我们的主题中。在您的主题的 functions.php 文件中添加以下代码:
function salong_add_editor_style() {
    global $post;

    if( 'post' === $post->post_type ) {
        add_editor_style( 'path/to/custom-editor-style.css' );
    }
}
add_action( 'admin_init', 'salong_add_editor_style' );
请将上面的代码中的“post_type_name”替换为您的文章类型的名称。此代码将确保只在编辑该文章类型时添加自定义样式。 步骤 3:为您的文章类型添加样式 最后,在 custom-editor-style.css 文件中添加您想要为您的文章类型添加的样式。您可以使用选择器针对您的文章类型添加样式,例如:
.post-type-name .wp-block {
    /* 自定义样式 */
}
现在,当您编辑您的文章类型时,将会应用您为该文章类型添加的自定义样式。
标签:
本文原创,作者:萨龙龙,其版权均为萨龙网络所有。
如需转载,请注明出处:https://salongweb.com/wordpress-editor-add-css.html
萨龙龙

萨龙龙

侠客
一个平平常常的人,热爱生活、旅行和摄影,骑行去过西藏,一直计划再去。14年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1412.36M457.17W4.42W
加载中…
分享:
WordPress 主题 Slearn Pro 产品插件之属性设置
WordPress 主题 Slearn Pro 产品插件之属性设置上一篇
WordPress 出现 Allowed memory size of 134217728 bytes exhausted 错误如何修复下一篇
WordPress 出现 Allowed memory size of 134217728 bytes exhausted  错误如何修复
相关文章
总数:114

WordPress 管理面板中禁用主题和插件编辑器

默认情况下,WordPress允许用户通过后台管理面板编辑主题和插件代码。虽然它是一个方便的功能,但对于主题或插件作者没有任何用途,最重要可以防…
萨龙龙萨龙龙WordPress7年前001.01W0

WordPress 功能函数—— add_action(将函数挂接到特定的操作上)

描述 WordPress核心执行期间,在特定点执行时或特定事件发生时,Actions是钩子。插件可以指定使用Action API在…
萨龙龙萨龙龙WordPress Functions7年前002.30W0

更新至 WordPress5.0版本后古腾堡(Gutenberg)编辑器发布与更新失败的解决方法(只对萨龙网络主题测试)

萨龙网络所有主题都集成了很多优化功能,在 WordPress 更新至5.0版本后,古腾堡(Gutenberg)编辑器发布与更新文章/页面就出现错…
萨龙龙萨龙龙WordPress7年前009.14K0

自定义WooCommerce产品文章hook顺序

最近在做一款企业产品展示的商城网站,设计WooCommerce产品文章的布局与默认的布局有很大的不同,所以其中的一些模块都需要重新调整。WooC…
萨龙龙萨龙龙WooCommerce9年前001.51W0

Nuxt 3 项目中集成 AI API 实现智能内容生成与多语言翻译

随着大语言模型(LLM)技术的飞速发展,越来越多的 Web 应用开始集成 AI 能力——从智能客服、内容摘要到自动翻译,AI 正在重塑前端开发的…
萨龙龙萨龙龙WordPress11天前002120

WordPress + 宝塔面板速度优化方案 Memcached + Redis

WordPress 网站的速度应该上每个站长必须关注的一个问题,对于刚使用 WordPress 的朋友,优化网站速度是比较困难的事情,找不到好的…
萨龙龙萨龙龙WordPress, 建站技术6年前002.39W0

禁用 WordPress 裁剪功能包括自动生成的 768 像素图片

WordPress 媒体库是很强大、管理媒体相当方便,如果媒体多就给数据库增加了压力,而且很多媒体是不需要上传到媒体库,上传的图片会增加很多无用…
萨龙龙萨龙龙WordPress8年前001.36W0

WordPress 一键数据库初始化重置插件:WordPress Reset

在开发 WordPress 主题中,需要 N 多次测试,这样就需要多次重装测试网站,这样相当的麻烦。今天了解到一款数据库初始化插件:WordPr…
萨龙龙萨龙龙WordPress7年前001.97W0

萨龙网络站点群所有网站使用https访问

HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer),是以安全为目标的…
萨龙龙萨龙龙WordPress10年前001.49W0

WordPress MU多站点设置子站点上传路径和文件的URL地址

为了提高网站的访问速度,萨龙网络也将所有的媒体文件放置在二级域名下,WordPress 3.5以上的版本,隐藏了后台的媒体(Media)设置页面…
萨龙龙萨龙龙WordPress10年前001.62W0

WordPress主题使用jQuery插件Isotope添加作品集筛选功能

上一篇文章我们介绍了Isotope,功能强大,效果出众的jQuery插件,但是文章中的代码并不能使用在项目中,所以今天通过Wordpress主题…
萨龙龙萨龙龙jQuery插件, WordPress10年前001.96W0

WordPress 功能函数—— addslashes_gpc(添加斜杠以转义字符串)

描述 添加斜杠以转义字符串。 如果设置了magic_quotes_gpc,将首先删除斜杠。 用法 …
萨龙龙萨龙龙WordPress Functions7年前009.04K0
评论表单游客 您好,欢迎参与讨论。
加载中…
评论列表
总数:0
萨龙网络
没有相关内容