如何在子主题中编辑 layout.css

Question

我正在儿童主题中工作。我的 style.css 文件在子主题中工作正常，但我的 layout.css 文件在子主题中不起作用。

父主题中 layout.css 的目录结构是 mytheme/css/layout.css

我在子主题中保留了相同的目录结构，即 mychildtheme/css/layout.css

但是当我在 child layout.css 中编写代码时，它不起作用。

浏览器从父主题中选取代码 (layout.css)

请告诉我我必须做什么才能让我的 layout.css in child theme 正常工作。

Answer 1

样式表不同于常规主题 php 文件。有了这样一个php文件，在你的主题中创建一个同名文件就足够了，WP就知道用它了。但是，对于 css，创建同名文件是不够的。您必须明确地将其包含到您想要的页面中。

最好的方法是在子主题的 function.php 文件中使用 wp_enqueue_style 函数。根据您描述的目录结构，这是执行此操作的方法：

 <?php wp_enqueue_style( 'child-theme-layout', get_stylesheet_directory_uri().'/css/layout.css' ); ?>

Answer 2

您需要在子主题中包含 layout.css 文件。更详细的资料，你可以看这里：

http://codex.wordpress.org/Function_Reference/wp_enqueue_style

Answer 3

最好的解决方案是确保子主题 style.css 在父主题 layout.css 之后加载。然后你可以通过 style.css

以通常的方式轻松覆盖你需要的小东西

这是一些适用于 WooThemes 产品的代码，可确保您的子主题 css 始终在父子主题 layout.css

之后加载

它属于子主题的 functions.php

function use_parent_theme_stylesheet() {
    // Use the parent theme's stylesheet
    return get_template_directory_uri() . '/style.css';
}

function my_theme_styles() {
    $themeVersion = wp_get_theme()->get('Version');

    // Enqueue our style.css with our own version
    wp_enqueue_style('child-theme-style', get_stylesheet_directory_uri() . '/style.css',
        array('woo-layout'), $themeVersion);
}

// Filter get_stylesheet_uri() to return the parent theme's stylesheet 
add_filter('stylesheet_uri', 'use_parent_theme_stylesheet');

// Enqueue this theme's scripts and styles (after parent theme)
add_action('wp_enqueue_scripts', 'my_theme_styles', 20);

如何在子主题中编辑 layout.css

How do I edit layout.css in child theme

wordpress

themes

parent-child