Avada Forums Community Forum Styling in child theme’s “style.css” file not working

Viewing 15 posts - 1 through 15 (of 18 total)
  • Author
    Posts
  • calgary
    Participant
    Post count: 13

    I am using the Avada Child theme. I come from a hand-coded HTML/CSS background, so am used to placing all CSS code in a “style.css” file. When I try to do so (\\wp-content\themes\Avada-Child-Theme\style.css), no styles are applied. Nothing happens. When I apply the same styles through Theme Options –> Customize CSS, it works fine.

    That being the case, what is the point of even having the style.css file?

    davelovely
    Participant
    Post count: 2

    I am having the exact same issue! Although my question is different :-). My question is: How can I fix this issue so the styles.css file in my Avada Child Theme is recognized and takes precedence over parent styles.css? Or how can I get an external file (not a .php program within WordPress) to make use of the Avada Custom CSS? I can’t get that to work but want it to. Thanks.

    marklchaves
    Participant
    Post count: 873

    Hi Guys,

    Here’s a quick test I run on a fresh install to make sure my child theme is good. Note: this is just a quick sanity test.

    
    /* Let's turn our site into a day glo disco scene. */
    body {
        /* Need to override all of these. */
        font-family: 'Courier New', Courier, monospace !important;
        font-size: 1.5rem !important;
        color: violet !important;
        font-weight: normal !important;
        background-color: #111111 !important;
    }
    
    h1, h2, h3 {
        font-weight: 600;
    }
    
    h1, h1.entry-title {
        /* Override for testing. */
        font-size: 4rem !important;
        color: darkgreen !important;
    }
    
    h2 {
        font-size: 3rem;
        color: darkorange;
    }
    
    h3 {
        font-size: 2rem;
        color: darkslateblue;
    }
    
    a {
        color: lightseagreen !important;
    }
    
    div {
        /* Looks like don't need to override. */
        border: 2px solid lightgreen;
        background-color: khaki;
    }
    
    p {
        /* Looks like don't need to override. */
        background-color: red;
        color: blue;
    }
    

    If this test doesn’t work, make sure your child theme is active. Then, check that your functions.php has this at minimum.

    
    function theme_enqueue_styles() {
        wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( 'avada-stylesheet' ) );
    }
    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
    

    Also, always use your dev tools to inspect the element in question. You can see source CSS file referenced for every element using the inspector. It’s a beautiful thing.

    Good luck!

    P.s., @davelovely, you can use standard methods for including local or external CSS. But for WordPress you should always register and enqueue for good practise.

    https://code.tutsplus.com/tutorials/loading-css-into-wordpress-the-right-way–cms-20402

    calgary
    Participant
    Post count: 13
    davelovely
    Participant
    Post count: 2

    Thanks @markichaves. So I do have the suggested code in my functions.php file. Interestingly using the inspect element dev tool I see that the child theme style.css file is being found. But it is not getting priority. The avada-stylesheet is taking precedents. So I used !important in my child theme style.css and guess what. It uses that. But I should not have to (and I don’t want to) use !important. That causes many unintended consequences.

    Do you have any ideas how I can fix this problem?

    Thanks again!

    GriffinGraffix
    Participant
    Post count: 2

    The fix by adding the above code to functions file isn’t working for me. I do have child theme active. I also tried by removing my previous scripts loading code as well and leaving only the one specified above with no results either.

    Here’s what’s in my function file:

    <?php
    function avada_child_scripts() {
    	if ( ! is_admin() && ! in_array( $GLOBALS['pagenow'], array( 'wp-login.php', 'wp-register.php' ) ) ) {
    		$theme_info = wp_get_theme();
    		wp_enqueue_style( 'avada-child-stylesheet', get_template_directory_uri() . '/style.css', array(), $theme_info->get( 'Version' ) );
    	}
    }
    add_action('wp_enqueue_scripts', 'avada_child_scripts');
    
    function theme_enqueue_styles() {
        wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( 'avada-stylesheet' ) );
    }
    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
    
    add_filter('gettext', 'translate_text'); 
    add_filter('ngettext', 'translate_text');
    function translate_text($translated) { 
    $translated = str_ireplace( 'Related Projects', 'Similar Dogs ', $translated );
    $translated = str_ireplace( 'Project Details', 'Breed Traits', $translated );
    return $translated; 
    }
    spirittlk
    Participant
    Post count: 4

    If anyone solves this I’ll be forever grateful. I had to delete the child style.css and just copy it all into the “custom CSS” filed in the Avada options which has drastically slowed my site. This all started being a problem with the latest avada upgrade. Has anyone filed a support ticket? Thank you!

    spirittlk
    Participant
    Post count: 4

    Guess what! Avada posted the solution here:
    https://theme-fusion.com/support/submit-a-ticket/

    It has to do with updating a few lines in the Child’s functions.php file and was an easy fix!

    Ammar. S
    Keymaster
    Post count: 2540

    Hello Everyone

    Just a note, this has also been fixed in our default theme that comes with the complete document package, if you simply download and install it, you should be able to use the new child theme and add your styles further there.

    Thanks

    -Ammar

    MLBTeam
    Participant
    Post count: 1

    Please post the actual fix, instead of linking to create a support ticket!

    benr
    Participant
    Post count: 2

    Here you go:

    
    function theme_enqueue_styles() {
      wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', [] );
    }
    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 20 );
    
    Ammar. S
    Keymaster
    Post count: 2540

    Hello @benr

    Thanks for helping out the fellow community members, to everyone else the fix is already in our Submit a Ticket section and again this is already put in our updated child theme file if you download the complete package.

    Thanks

    -Ammar

    infosolve
    Participant
    Post count: 5

    Hi Guys,

    I’ve just come across this now, are you saying any custom styling that has the following child style sheet reference will not work?

    Old Child function.php action:
    function theme_enqueue_styles() {
    wp_enqueue_style( ‘child-style’, get_stylesheet_directory_uri() . ‘/style.css’, array( ‘avada-stylesheet’ ) );
    }
    add_action( ‘wp_enqueue_scripts’, ‘theme_enqueue_styles’ );

    New Child function.php action:
    function theme_enqueue_styles() {
    wp_enqueue_style( ‘child-style’, get_stylesheet_directory_uri() . ‘/style.css’, [] );
    }
    add_action( ‘wp_enqueue_scripts’, ‘theme_enqueue_styles’ );

    Regards,
    Paul

    Jenara
    Participant
    Post count: 1

    I was having the same issue and updated my functions.php in my child theme with the suggested action.

    
     function theme_enqueue_styles() {
        wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', [] );
      }
      add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
    

    It is now working. Thanks for the fix!

    1kn
    Participant
    Post count: 23

    Hello all,
    I hope you are well?
    I have now implemented everything as described above, tried every possibility, it still does not work. My style.css in the child theme folder is not working. What am I doing wrong, it is also a clean Avada installation. Thanks for a reply in advance.
    Best regards, Alexander

Viewing 15 posts - 1 through 15 (of 18 total)
  • You must be logged in to reply to this topic.