html5blank的Wordpress儿童主题

Question

I'm having so much trouble setting up a child theme of the html5blank theme. To the point where I'm doing a fresh install of the parent theme and starting from scratch - and writing this post as I go through it! Basically upon creating the child them I now need to load my custom /css/main.css file - and it's not having it! Description of setup process follows:

I've dropped a freshly downloaded html5blank folder into /themes/ and activated it. After that I have created another folder within /themes/ called "html5blank-child". Within that I've created a new, blank style.css and functions.php.

Within style.css I have the following:

/*
 Theme Name:   HTML5 Blank Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  HTML5 Blank Child Theme
 Author:       My Name
 Author URI:   http://myportfolio.com
 Template:     html5blank
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  html5blank-child
*/

And within functions.php I have:

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
?>

With all that done, I active my child theme. With all that done, everything still appears to be working. As I've created static templates of the website, I drop my 'img', 'css', 'font' and 'js' folders into the html5blank-child.

Now my 'actual' CSS file has a path of: html5blank-child/css/main.css

I need to load this file in. I was told to adjust my functions.php CSS path to: /css/main.css ...but it won't load the file at all. I've also tried using get_stylesheet_directory_uri() instead of get_template_directory_uri() as was advised by someone else but no luck!

The reason I've documented the process like this is, last time I got to this point if I went to access the Wordpress admin using http://localhost:8888/websitename/admin it won't redirect to wp-admin like it normally does. Also when I went to save a post, I've get a blank page. Thankfully that isn't happening this time so I guess it's a good (better) start but now I need to get my files loaded in.

Hope someone can help! :)

Answer 1

You need to import the style.css from main theme first inside the style.css of the child theme.

Use @import to import the css file first.

Also remove the parent-style from functions.php of child theme and then include your html5blank-child/css/main.css like the following given,

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'child-main', get_stylesheet_directory_uri() . '/css/main.css' );
}

Answer 2

Load the parent themes style.css first, then load your child themes CSS like this:

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-main', get_stylesheet_directory_uri() . '/css/main.css', array('parent-style') );
}