Ich nehme am Udemy-WordPress-Kurs teil, um ein benutzerdefiniertes WordPress-Block-Theme zu erstellen. Ich habe den Blocktyp erfolgreich in function.php registriert und kann meinen Block im Gutenberg-Editor auswählen.
Das Tutorial schlug vor, die folgende Methode zu verwenden, um die Stile für mein Gutenberg-Blockelement zu laden, damit das CSS auch im Frontend geladen wird.
function lr_theme_features() {
// Enqueue editor styles
// Borrowed from TwentyTwentyToTheme
add_editor_style( 'style.css' );
add_theme_support('editor-styles');
}
add_action('after_setup_theme', 'lr_theme_features');
Egal was ich mache, Gutenberg lädt die style.css-Datei meines Blocks nicht.
Bild aus dem Gutenberg-Backend
Irgendwelche Tipps? Was könnte mir fehlen oder wie kann ich das Problem beheben?
Vielen Dank!
我的管理 CSS 也遇到了一些问题。 我发现如果你在管理 style.css 中像这样导入 CSS，它会破坏样式加载：
@import url("https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap");奇怪的是，它无需引号即可工作，如下所示：
但不确定这是否是一个好的做法...... 最好的做法是像这样加载外部库，而不是使用 import 语句：
希望对其他人有帮助！
在基于块的主题,
wp-block-styles用于在编辑器和前端加载样式表。 TwentyTwentyTwo 主题使用相同的技术；鉴于基于块的主题相对较新，您可能遵循了（现在）过时的主题教程。function lr_theme_features() { // Add support for block styles. add_theme_support( 'wp-block-styles' ); // Enqueue editor styles. add_editor_style( 'style.css' ); } add_action('after_setup_theme', 'lr_theme_features');如果您仍然看不到正在加载的样式，请检查您所定位的块的类名称是否与 HTML 标记匹配。
PS。始终清除浏览器缓存/硬刷新，以确保您没有看到编辑器的缓存版本 - 这是导致许多问题的一个非常常见但被忽视的原因。