WordPress.org

Ready to get started?Download WordPress

Forums

transferring functions to a child theme (4 posts)

  1. dbphte1
    Member
    Posted 3 years ago #

    i've created a child theme based on belle, which uses some preset colour schemes. in this site the colour of various bits of text is defined by a file called blue.css, which is in the parent theme. How do I change it so that these are controlled by the equivalent file in the child theme?
    (Think it has something to do with theme options/functions.php, but when I tried importing functions.php into the child theme the site doesn't work)

  2. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Note: background issues here.

    How is the Theme applying the color scheme style sheet? I realize that you select the color scheme via Theme Options, but how does the Theme use the Theme option to apply the color scheme?

    If it's enqueueing the stylesheet based on the Theme option, then the easiest approach will be to enqueue your own stylesheet, that makes changes based on the Parent Theme's blue.css, at the same hook that the parent enqueues style.css, but with a lower priority.

    So:

    1) Leave blue.css alone; no need to touch it
    2) Create a new stylesheet, in your Child Theme, that defines any changes/additions to blue.css.
    3) Find the hook where the Parent Theme is enqueueing blue.css, and determine the hook priority (default is 10).
    4) Enqueue your custom stylesheet at the same hook, with a lower priority (higher number - i.e. if blue.css is enqueued with a priority of 10, enqueue your custom stylesheet with a priority of 11).

  3. dbphte1
    Member
    Posted 3 years ago #

    sorry, but that's a bit much for me. Are you essentially saying i need to find how the theme is using blue.css and then link it to the child theme's blue.css?

    2) think i've done this, just @import blue.css into child theme's stylesheet?
    3)think this is my main problem, been trawling codex stuff all morning, no idea how to do this
    4) don't know either

  4. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    Step one: I'm saying don't @import blue.css into your child Theme's style.css file.

    More than likely, stylesheets are loading in this order:

    Parent Theme:

    style.css (Parent)
    blue.css (Parent)

    Child Theme:

    style.css (Child)
    blue.css (from Parent)

    ...so, any changes you're making in the Child Theme's style.css are being overwritten by the Parent Theme's blue.css.

    Step two: I mean: create a different stylesheet than the Child Theme's style.css, because you need to add it to the template using a different method (you need to enqueue it).

    Step three: your Theme is hard-coding the colorstyle css file in the document head, here:

    <link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/colorstyles/<?php echo $wpb_color_scheme; ?>.css" type="text/css" media="screen" />

    Not the best approach, but easy to override.

    Step four: Simply enqueue your custom color stylesheet at wp_enqueue_scripts, e.g. in functions.php:

    function mytheme_custom_colorstyle() {
    ?>
    <script style="text/css">
    /* place your custom CSS definitions here */
    </script>
    <?php
    }
    add_action( 'wp_enqueue_scripts', 'mytheme_custom_colorstyle' );

Topic Closed

This topic has been closed to new replies.

About this Topic