古腾堡在不修改主题的情况下增加了css类？

时间：2020-01-10 作者：feetwet

要添加的“高级”选项Additional CSS Classes 古腾堡街区看起来很有用。但是除了去添加一个主题范围的类之外，还有什么方法可以定义一个CSS类用于该post选项吗？

我希望有某种方法可以修改特定块上的CSS，而不必将其转换为HTML块。

Example: 在我要设置的一个列表块的一个帖子上ul {padding-left:2em}. 这是一次性的事情。我不希望它应用于该帖子或任何其他帖子上的其他列表块，因此我不想经历创建子主题并将其添加到其style.css.

2 个回复
SO网友:WebElaine

根据您的目标，您可以通过多种方式为块添加自定义CSS。

Theme

通过使用主题的自定义CSS区域或创建子主题将其添加到“themewide”中，既可以影响特定类型块的所有副本，也可以仅在一篇文章中针对一种类型的块。例如，WP站点的每个URL都应该有一个<；车身（>）；类，该类指定它是什么类型的内容，这将变得相当精细。示例：如果有一个页面要作为目标，body.page-id-# 以该页面为目标，因此可以隔离CSS以仅影响该页面。这是应用块样式更改的最常用方法，因为正如您所提到的，在使用该类的任何地方，您都可以在主题中更新它一次，并且它会同时影响所有这些位置。

Plugin

您还可以编写一个插件，只在需要的地方将CSS排队。这可能会有所不同：您可以在所有页面、类别或单个帖子上排队，无论您需要什么。

或者，如果你的主题没有自定义CSS区域，那么有现成的插件可以让你添加自己的CSS。你必须研究他们的能力，看看是否有可能将CSS限制在某些领域，或者是否像改变主题一样，在整个站点范围内。

Inline

最后，您已经确定了允许您添加内联CSS的唯一选项—使用HTML块。WP在大多数情况下都会避开内联样式，因为它是模块化的——通常，如果您在一个地方更改了某些内容，那么让它在其他地方自动更新是很方便的，而类就是这样做的。内联样式必须单独更新。

SO网友:Krishan Kaushik

add code in your functions.php


add_action(\'wp_head\', \'hook_in_frontend_head\');

function hook_in_frontend_head() {
$screen = get_current_screen();

if($screen->id == \'your-blog-page-id\') {
?> <style> your additionl styles here</style>
<?php
}

}
标签： css   block-editor   小码农  

相关推荐

将css附加到unction.php时出现白屏

当我附加下线代码时，我会看到白色屏幕，在控制台日志中，它会出现下线错误，我的浏览器是最新的密码body:not(.no-transition) #wrapper, .animsition-overlay { position: relative; opacity: 0; -webkit-animation-fill-mode: both; animation-fill-mode: both; } 控制台日志错误JQMIGRATE：安装了Migrate，版本为1.4.