首页 > 解决方案 > Wordpress 子主题 css 不会覆盖父 css

问题描述

我正在使用 mies-child 主题,但问题是我看不到 css 更改会影响我的网站。

这是我的孩子 style.css 的样子:

/*
Theme Name: Mies Child
Theme URI: http://pixelgrade.com/demos/mies
Author: PixelGrade Team
Author URI: http://pixelgrade.com
Template: mies
Description: MIES is a front line parallax Architecture WordPress Theme prized for allowing you to present your activity within a delightful and captivating experience. It's perfect for a full range of presentations and portfolio projects of designers, architects or photographers.
License: Themeforest Split Licence
License URI: -
Text Domain: mies_txtd
Domain Path: /languages/
Tags: white, light, dark, responsive-layout, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, full-width-template, theme-options, translation-ready
*/

这是我的子 functions.php 文件:

<?php
/*
 * ===== Theme Translation =====
 * Load the translations from the child theme if present
 */
add_action( 'before_wpgrade_core', 'mies_child_theme_setup' );
function mies_child_theme_setup() {
    load_child_theme_textdomain( 'mies_txtd', get_stylesheet_directory() . '/languages' );
}

/**
 * ===== Loading Resources =====
 * Add all the extra static resources of the child theme - right now only the style.css file
 */

function mies_child_enqueue_styles() {
    // Here we are adding the child style.css while still retaining all of the parents assets (style.css, JS files, etc)
    wp_enqueue_style( 'mies-child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array('wpgrade-main-style') //make sure the the child's style.css comes after the parents so you can overwrite rules
    );
}

add_action( 'wp_enqueue_scripts', 'mies_child_enqueue_styles' );

标签: javascriptphpcsswordpress

解决方案


当父级的样式尚未入队时,您尝试将$handle父级的入队样式添加为子入队脚本wpgrade-main-style的依赖项。$deps

首先使用检索您的父样式get_template_directory_uri()并将其入队,然后使用检索您的子样式并将其入队,在您的子入队脚本中get_stylesheet_directory_uri()添加父样式作为依赖项,如下所示:$deps

function mies_child_styles() { 
    
    // enqueue parent
    wp_enqueue_style( 'wpgrade-main-style', trailingslashit( get_template_directory_uri() ) . '/style.css', array(  );
   
    // enqueue child
    wp_enqueue_style( 'mies-child-style', trailingslashit( get_stylesheet_directory_uri() . '/style.css', array('wpgrade-main-style') );
}
add_action( 'wp_enqueue_scripts', 'mies_child_styles' );


推荐阅读