0

I am using Enough theme and i want to create a child theme the way suggested in codex i.e. using wp_enqueue_style. I am doing it the way it's explained but left margin more now like it's indented to right. Seems to me some stylesheet loading problem.

I have created style.css and functions.php in child theme folder. In parent theme folder there is 1 style.css file and 11 css file inside '/css' directory.

I have tried lot of things but not able to do it correctly. Below is how i am trying to load parent theme style sheets.

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {

    wp_enqueue_style( 'styles', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/admin-options.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/base.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/colors.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/box-modules.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/approach.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/comment.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/fonts.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/layout-fluid.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/normalize.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/post-format.css' );
    wp_enqueue_style( 'styles', get_template_directory_uri() . '/css/ua.css' );
}
?> 

I am using 'style' as first parameter because in the functions.php in parent theme i.i Enough i have following code, (I have put a line with arrow ------------> in front of the the code line) -

/**
 *
 *
 */
if ( !function_exists( "enough_enqueue_scripts_styles" ) ) {

    function enough_enqueue_scripts_styles() {

        global $is_IE, $enough_version;

        $enough_csses = array( "css/normalize.css", "genericons/genericons.css", "css/fonts.css", "css/box-modules.css", "css/comment.css", "css/ua.css", "css/colors.css", "css/base.css", "css/layout-fluid.css", "css/post-format.css", "css/approach.css" );

        foreach ( $enough_csses as $ecnough_css_path ) {

            if ( file_exists( trailingslashit( get_stylesheet_directory() ) . $ecnough_css_path ) ) {

                wp_enqueue_style( 'enough_' . basename( $ecnough_css_path, '.css' ), trailingslashit( get_stylesheet_directory_uri() ) . $ecnough_css_path, array(), $enough_version );
            } else {

                wp_enqueue_style( 'enough_' . basename( $ecnough_css_path, '.css' ), trailingslashit( get_template_directory_uri() ) . $ecnough_css_path, array(), $enough_version );
            }
        }

----------->wp_enqueue_style( 'styles', get_stylesheet_uri(), array( 'enough_approach' ), $enough_version );
        $gallery_style = enough_gallerys_css();
        wp_add_inline_style( 'styles', $gallery_style );

        wp_enqueue_style( 'enough-web-font', apply_filters( 'enough_web_font', '//fonts.googleapis.com/css?family=Ubuntu:400,700' ) );

        wp_enqueue_script( 'jquery' );

        wp_enqueue_script( 'comment-reply' );

        if ( $is_IE ) {

            wp_register_script( 'html5shiv', get_template_directory_uri() . '/inc/html5shiv.js', array(), '3', false );

            wp_enqueue_script( 'html5shiv' );
        }
    }

}

Do i need to create all css files in child themes ? or I can have only 1 css file namely style.css in child theme ? What would be the correct way of doing this ?

Edited this way

<?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' );
    wp_enqueue_style( 'style1', get_template_directory_uri() . '/css/admin-options.css' );
    wp_enqueue_style( 'style2', get_template_directory_uri() . '/css/base.css' );
    wp_enqueue_style( 'style3', get_template_directory_uri() . '/css/colors.css' );
    wp_enqueue_style( 'style4', get_template_directory_uri() . '/css/box-modules.css' );
    wp_enqueue_style( 'style5', get_template_directory_uri() . '/css/approach.css' );
    wp_enqueue_style( 'style6', get_template_directory_uri() . '/css/comment.css' );
    wp_enqueue_style( 'style7', get_template_directory_uri() . '/css/fonts.css' );
    wp_enqueue_style( 'style8', get_template_directory_uri() . '/css/layout-fluid.css' );
    wp_enqueue_style( 'style9', get_template_directory_uri() . '/css/normalize.css' );
    wp_enqueue_style( 'style10', get_template_directory_uri() . '/css/post-format.css' );
    wp_enqueue_style( 'style11', get_template_directory_uri() . '/css/ua.css' );

}
?>

And here is style.css in child theme

/*
Theme Name: Enough Child
Theme URI: http://www.tenman.info/wp3/enough/
Description: Satisfied enough necessary minimum structure Responsive Theme. HTML5 , Supports Post Format Archives , You can select your favorite Post Format
Author: Tenman
Author URI: http://www.tenman.info/wp3/
Version: 1.22
Tags: two-columns,custom-colors, custom-header, custom-background, custom-menu, editor-style, threaded-comments, sticky-post, flexible-header
Template:     enough
Text Domain: enough-child
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

The images _

Parent Enough enter image description here

0

It is very best described in the WordPress Child theme codex page.

Basically to load child theme and parent theme stylesheet files, you have to just add following code in the functions.php file of your child theme.

function my_theme_enqueue_styles() {

    $parent_style = 'parent-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'styles',
    get_stylesheet_directory_uri() . '/style.css',
    array( $parent_style, 'enough_base' ),
    wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 99 );

You don't need to enqueue other parent theme CSS files if you are not changing them.

  • I understand and i did that but there is only one problem and that too with ''enough'' theme. Is there anyway i can show the images ? If you know any site or something. The problem is that the body in which i write text has shrunk or i can say now there is greater margin on the left and right of the text. – Desperado Apr 21 '17 at 9:35
  • Yes you can upload image sin your question as described in this topic meta.stackexchange.com/a/75498/218052 Also please share your site URL to troubleshoot the issue. – Vinod Dalvi Apr 21 '17 at 9:39
  • Here is the link Have edited the question . Please have a look . Images - There is margin difference and that is the only problem. – Desperado Apr 21 '17 at 9:48
  • I don't see the issue on your shared site and also don't see you are using any child theme on your site. Please advise. – Vinod Dalvi Apr 21 '17 at 9:55
  • Just take a screenshot and then i will change theme to child . – Desperado Apr 21 '17 at 9:57
1

about styles you need to specify a name for each style the cant be the same and its necessary if you are overwriting it in your child and you want the parent styles to come before overwriting.

so if you want to your parents style.css loads after your childs style.css you need to queue it in your functions.php file so add this in your child themes functions.php:

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'enough_style'; // needs to be same as parent style

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css');
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles',100 ); //it will be queued after base.css and overwrites it
?>

i tested this code and it works well now. your style.css is ok and u dont need to change it.

  • What changes should i make ? I have already added the template you @vahid have shown. Do you mean that for every wp_enqueue_style function call i should use different name for first parameter ? Currently i have used 'styles'. Can i put any name that i want ? – Desperado Apr 21 '17 at 6:58
  • @Desperado yes you can specify any name, and actually they has to be different. – sorrow poetry Apr 21 '17 at 7:03
  • I have edited code and also posted here ( edited the question ) . Have a look tell me what i am doing wrong ? Styling is still different. – Desperado Apr 21 '17 at 7:07
  • you don't have to create all css files in the child theme and you only need style.css , you need to load css parents only if you are overwriting them, actually you don't even need fuctions.php. – sorrow poetry Apr 21 '17 at 7:18
  • @Desperado wait a few minutes and i will edit my answer – sorrow poetry Apr 21 '17 at 7:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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