[Theme: Graphene] Proper method of creating a child theme

  • Resolved kookiekrysp

    (@kookiekrysp)


    8 years, 7 months ago

    I am trying to create a child theme for my website. When I go to the WordPress Codex I am instructed to “enqueue the parent and child theme stylesheets” instead of using @import.

    This was the suggested code:

    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

    }
    However, since I have more than one style.css it instructs that I “maintain all of the Parent Theme dependencies”. I have absolutely no idea what this means. I was able to easily make a child theme using @import on a test version of my site and would like to use that method, but I want to know if that is safe before I do the same thing on my main site.

    Or could someone give me an idea of how to maintain all the dependencies, please?

    I found 7 different .css files in the following order:

    editor-style-rtl.css
    editor-style.css
    rtl.css
    style-bbpress.css
    style-light.css
    style-print.css
    style.css

    Thanks in advance for any help you can give me, and I hope I formatted this question correctly.

    This is my site: Kookie Krysp Reads

Viewing 8 replies - 1 through 8 (of 8 total)
  • Tahoerock

    (@tahoerock)

    8 years, 7 months ago

    Hi kookiekrysp
    Use @import method and………
    It does not matter what style sheet is in place for any style changes.
    Copy just style.css to your child theme and make all the css changes you will need to that style sheet.
    It takes precedence to any style sheet in your parent style sheet.

    Second:
    You can install this plugin SIMPLE CUSTOME CSS to do all styling on your website

    Do you need any further help?
    Let me know
    Cheers
    TR

    kjodle

    (@kjodle)

    8 years, 7 months ago

    @tahoe Rock:

    Copy just style.css to your child theme and make all the css changes you will need to that style sheet.

    I think you mean create an empty, blank, style.css file in your child theme. You should never just copy over the parent style sheet, as it can cause problems.

    FYI: Apparently, WordPress is recommending that child theme enqueue child theme stylesheets, in order to make sure that stylesheets and scripts get loaded in the correct order.

    @kookiekrysp:

    The editor-style.css and editor-style-rtl.css files are used to style your post editor; your readers will never see them.

    Any style sheet labled ‘RTL’ is for WordPress to use if you’ve installed a language that goes from right to left, such as Arabic or Hebrew. Your blog is in English, you don’t need to worry about those.

    The plugin Tahoe Rock mentioned is a good one, because it adds your custom CSS as a separate stylesheet. This means that people visiting your website will have it cached in their browsers after their first visit. This reduces overhead on your server, and makes your website load faster for your users.

    If all you want is custom css, then that plugin is a good way to go. If you need to add custom functions, you will definitely need a child theme.

    Thread Starter kookiekrysp

    (@kookiekrysp)

    8 years, 7 months ago

    Thank you both!

    I do need to add custom functions in order to change the button text on my blog. That’s the only reason I am even attempting to make a child theme

    When I created the child theme using @import on my test site I also created a blank style.css file and a blank functions.php file. Then I found the code to change the button text, and everything seemed to load just fine.

    @kjodle do you think it will be okay to just use the @import method or will it slow my site down too much? I’m not super worried about speed, but I don’t want to be penalized by Google or have a slow site.

    If I need to enqueue, I may just have to learn to love the button text the way it is.

    kjodle

    (@kjodle)

    8 years, 7 months ago

    @kjodle do you think it will be okay to just use the @import method or will it slow my site down too much?

    It’s not the official WP way, but if your stylesheets and scripts still load in the correct order, everything should be fine. Using a child theme will speed things up a bit because browsers can cache your style sheet.

    To be honest, I wasn’t even aware that WP had changed their recommendation until you mentioned it.

    (If you really want to speed things up a bit more, you can add some “expires headers” in your .htaccess file. But save that until you get this bit figured out.)

    Thread Starter kookiekrysp

    (@kookiekrysp)

    8 years, 7 months ago

    Thanks a lot! I will just do it that way then. And I will look into the “expires headers” next. I’ve heard that helps, but wanted to get this finished first.

    Thanks again, you were very helpful. 🙂

    Thread Starter kookiekrysp

    (@kookiekrysp)

    8 years, 7 months ago

    Marking this resolved.

    kjodle

    (@kjodle)

    8 years, 7 months ago

    Copy just style.css to your child theme and make all the css changes you will need to that style sheet.

    But, never copy the entire stylesheet over—just those declarations you need to change.

    Thread Starter kookiekrysp

    (@kookiekrysp)

    8 years, 7 months ago

    Thank you! I got everything up and running, and my site seems to be pretty fast. I have definitely been inspired to learn more about coding and how to design a website though. It’s very interesting.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘[Theme: Graphene] Proper method of creating a child theme’ is closed to new replies.