1

I'm trying to add a child theme on a website, I created the folder called mythemename-child, I created the style.css file with this information inside:

/*
 Theme Name: Mizrahi-child
 Theme URI: http://www.templatemonster.com/wordpress-themes
 Description: Your theme description.
 Author: Matteo Schiatti
 Author URI: http://www.templatemonster.com/
 Template:     mizrahi
 Version:      1.0.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: mizrahi
 Tags: one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-menu, featured-images, post-formats, sticky-post, theme-options, threaded-comments, translation-ready
*/

After I created the function.php file with this content:

<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );

function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

I can see the child theme in the back office but when I activate it the site lose all the css.

I can't understand why, I tried also with the @import method on the style.css file but nothing:

@import url("../twentyfifteen/style.css");

I added this code on my function.php:

    <?php

function enqueue_parent_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/font-awesome.min.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/magnific-popup.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/magnific-popup.min.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/material-icons.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/material-icons.min.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/slider-pro.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/slider-pro.min.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/style.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/swiper.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/swiper.min.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/plugins/booked.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/plugins/builder.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/plugins/restaurant-menu.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/buttons.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/elements.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/footer.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/forms.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/header.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/menus.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/misc.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/navigation.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/post.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/site/social.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/widgets/about.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/widgets/custom-post.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/widgets/instagram.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/widgets/subscribe.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/css/dynamic/widgets/widget-default.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/rtl.css' );
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );

3 Answers 3

0

Am unable to comment and ask qns, so done as answer. Point 3 below does identify an error; the rest I expect you've covered. I've also added my own working enqueuer (but I only needed style.css)

  1. ensure the value specified for "Template:" at the top of your CSS matches the value for "Theme:" in parent's CSS

  2. View HTML source of page from your browser. What styles if any are listed in "html under <head>? This info may help with answers.

  3. WP Codex says the first argument/parameter of wp_enqueue_style must be a unique "handle" (name); but in your last example you use 'parent-style' as the handle for every style sheet.

  4. check parent's functions.php and see exactly what is being "enqueued".

  5. if its any help, this is code that works for me from my Hemingway child functions.php (I only need style.css). Note I am not using a string 'parent_style' but variable $parent_style which has been assigned a value. The WP Codex link above explains other settings used.

    function my_theme_enqueue_styles() {
      $parent_style = 'hemingway_style';
      wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
      wp_enqueue_style( 'child-style',
         get_stylesheet_directory_uri() . '/style.css', array( $parent_style), wp_get_theme()->get('Version') );
    }
    add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
    
  6. In answer to your question by enqueuing child CSS last you ensures that where Child and Parent CSS rules conflict then the CSS rules will be used by the browser.

0

Try This example:

Name of the stylesheet. Should be unique

function example_enqueue_styles() {

        // enqueue parent styles
        wp_enqueue_style('style-1', get_template_directory_uri() .'/style.css');

        // enqueue child styles
        wp_enqueue_style('style-2', get_stylesheet_directory_uri() .'/style.css', array('parent-theme'));

    }
    add_action('wp_enqueue_scripts', 'example_enqueue_styles');

in your code wp_enqueue_style( 'parent-style<-"this must be unique"', get_template_directory_uri().'/assets/css/dynamic.css' );

0

As I stated in the comments, the name of the CSS must be unique. You named every CSS with 'parent-style'. Each must have a different name.

Like so:

wp_enqueue_style( 'parent-style1', get_template_directory_uri().'/style1.css' );
wp_enqueue_style( 'parent-style2', get_template_directory_uri().'/style2.css' );

The code

function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

Is used if the theme has ALL of it styles inside the main style.css. In most of the cases, that doesn't work, because templates have more CSS inside another directories.

You will probably have to do something like:

function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/assets/another-style.css' );
}

And if you need to have your own CSS file, you need to enqueue it AFTER the parent

wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );

Enqueue the secondary styles first, and the main styles AFTER them.

Make sure the 'add_action' is called AFTER you create the function.

10
  • Standard themes such as twenty* do have all stylesheets in style.css
    – kero
    Sep 22, 2017 at 15:38
  • 1
    He is not using twenty*. Only the basic templates have that. And as I said: "In most of the cases" =) Sep 22, 2017 at 15:39
  • You are right, I (mostly) saw the the last import-line
    – kero
    Sep 22, 2017 at 15:40
  • It happens. All good. =) Sep 22, 2017 at 15:41
  • I edited my question with the new code of my function.php file. I tried to activate the child theme now but the result is worse than before. I put in the code all the css that I found in the assest folder. What do you mean with "And if you need to have your own CSS file, you need to enqueue it AFTER the parent"? I have a style.css in my child theme folder and I want to use just it to modify the css.
    – Crashy
    Sep 22, 2017 at 16:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.