萨龙网络
登录
首页-WordPress文章-WordPress-正文

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

萨龙龙萨龙龙
WordPress
3年前
0
0
2.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年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1402.36M457.16W4.42W
加载中…
分享:
WordPress 主题 Slearn Pro 产品插件之属性设置
WordPress 主题 Slearn Pro 产品插件之属性设置上一篇
WordPress 出现 Allowed memory size of 134217728 bytes exhausted 错误如何修复下一篇
WordPress 出现 Allowed memory size of 134217728 bytes exhausted  错误如何修复
相关文章
总数:113

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

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

WordPress 主题选项框架 Codestar Framework Pro 2.0专业版使用

萨龙网络在2018年9月份就写了一篇《WordPress简约实用的主题选项框架CodestarFramework》文章来介绍Codest…
萨龙龙萨龙龙
WordPress
7年前
0
0
3.03W
0

修改Woocommerce商品固定链接其它自定义文章类型适用

在更新Concise主题时集成了前端用户中心和商城插件,发现插件中为商城产品文章设置好了固定链接,所以把萨龙网络的作品集与商城的两种自定义类型的…
萨龙龙萨龙龙
WooCommerce
11年前
0
0
1.46W
0

WordPress+Nuxt.js+Vue.js开发的前端node项目被停止的处理方案

SlhaoPro主题前端上线后每天能收到宝塔的提示,说项目已经停止,找了很久没有发现问题。在查看node项目网站日志中的响应日志和错误日志时,…
萨龙龙萨龙龙
Nuxt.js, Vue.js, WordPress
2年前
1
1
1.15W
0

WordPress 自定义的评论查询类 WP_Comment_Query 参考文档和使用实例

WordPress获取评论所有主题都是使用wp_list_comments()函数,获取每篇文章的评论是相当的方便实用,唯一的不足是不能通过自…
萨龙龙萨龙龙
WordPress
7年前
0
0
1.80W
0

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

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

WordPress按自定义文章类型进行搜索

一般的Wordpress主题中都有多种自定义文章类型,除了了默认的文章还会有作品、商品等自定义类型的文章,而WordPress默认只能搜索到文章…
萨龙龙萨龙龙
WordPress
9年前
0
0
1.33W
0

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

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

WordPress 判断是否在循环中的函数 in_the_loop

WordPress主题开发中,很多时间需要在文章与列表中进行判断从而输出不同的内容,比如文章分类,只想在列表中显示,文章中不显示。列表页面可直…
萨龙龙萨龙龙
WordPress
7年前
0
0
1.11W
0

WordPress MU多站点解决Timthumb.php不显示缩略图

最近在开发Perimg图片主题,用户想要用Timthumb.php插件来实现缩略图,缩略图的顺序是自定义域、文章第一张图片与默认缩略图,而萨龙龙…
萨龙龙萨龙龙
WordPress
10年前
0
0
1.23W
0

WordPress循环中判断为每篇文章设计不同的样式

新闻视频类Yewan主题的首页文章布局是不规则,文章的布局多样化,这是如何实现的?其实是很简单的,我们在循环中进行判断,每一篇文章都可以输出不同…
萨龙龙萨龙龙
WordPress
10年前
0
0
1.28W
0

WordPress判断文章分页第一页和最后一页

Perimg主题,最近开发的一个图片主题,与之前开发的主题又有很多的进步,以及更多的、少见的实用功能。主题文章中如果是多页就会显示上下篇、上下页…
萨龙龙萨龙龙
WordPress
10年前
0
0
1.25W
0
评论表单游客 您好,欢迎参与讨论。
加载中…
评论列表
总数:0
萨龙网络
没有相关内容