• Resolved archampion

    (@archampion)


    How do I override dark css style?

    I tried enqueue css like this in functions.php

    <?php
    
    add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
    function enqueue_parent_styles() {
        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') );
    	wp_enqueue_style( 'dark-style', get_stylesheet_directory_uri() . '/dark.css', array( $parent_style ), wp_get_theme()->get('Version') );
    }
    

    But it didn’t work.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Theme Author Alexander Agnarson

    (@alxmedia)

    Hm, how do you mean override? Do you want to load the dark style from the child theme instead of parent one?

    If you put this in the child theme’s functions.php, it will load that function instead of the parent theme and you can edit it as you wish:

    
    function slanted_styles() {
    		wp_enqueue_style( 'slanted-style', get_stylesheet_uri() );
    		if ( get_theme_mod('responsive','on') =='on' ) { wp_enqueue_style( 'slanted-responsive', get_template_directory_uri().'/responsive.css' ); }
    		if ( get_theme_mod('dark','off') == 'on' ) { wp_enqueue_style( 'slanted-dark', get_template_directory_uri().'/dark.css' ); }
    		wp_enqueue_style( 'slanted-font-awesome', get_template_directory_uri().'/fonts/all.min.css' );
    	}
    
    Thread Starter archampion

    (@archampion)

    I want the excerpt text colour to be more brighter but the style is controlled by dark.css.

    I’m using a child theme. Also I want to change other colours as well that is controlled by dark.css to be more brighter. I’m not sure how to override that.

    And I have been trying to edit some part of the theme like added a “continue reading” link. I also realised that there is no search on the header. Looking at it at the moment and see how should I add in the search.

    Maybe you may want to considering updating the theme with “continue reading” and search on the header. ??

    • This reply was modified 5 years, 7 months ago by archampion.
    • This reply was modified 5 years, 7 months ago by archampion.
    Theme Author Alexander Agnarson

    (@alxmedia)

    If you go to Customize > Additional CSS and add your custom CSS there, it should override the styles in dark.css.

    Try adding this there as a test:

    
    .entry.excerpt { color: red; }
    
    Thread Starter archampion

    (@archampion)

    This does work but it would be better if it’s on child theme. Easier to manage too.

    Theme Author Alexander Agnarson

    (@alxmedia)

    What if you add this in your child theme’s functions.php and then add a custom.css file in the root of the child theme’s folder:

    
    function slanted_styles() {
    	wp_enqueue_style( 'slanted-style', get_stylesheet_uri() );
    	if ( get_theme_mod('responsive','on') =='on' ) { wp_enqueue_style( 'slanted-responsive', get_template_directory_uri().'/responsive.css' ); }
    	if ( get_theme_mod('dark','off') == 'on' ) { wp_enqueue_style( 'slanted-dark', get_template_directory_uri().'/dark.css' ); }
    	wp_enqueue_style( 'slanted-font-awesome', get_template_directory_uri().'/fonts/all.min.css' );
    	wp_enqueue_style( 'slanted-custom', get_stylesheet_directory_uri().'/custom.css' );
    }
    
    Thread Starter archampion

    (@archampion)

    I actually got it work. trying with responsive.css instead.

    I just queue my responsive.css after parent’s responsive.css.

    function enqueue_parent_styles() {
        wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    	wp_enqueue_style( 'slanted-style', get_stylesheet_uri() );
    	if ( get_theme_mod('responsive','on') =='on' ) { wp_enqueue_style( 'slanted-responsive', get_template_directory_uri().'/responsive.css' ); }
    	wp_enqueue_style( 'child-responsive', get_stylesheet_directory_uri().'/responsive.css' );
    	if ( get_theme_mod('dark','off') == 'on' ) { wp_enqueue_style( 'slanted-dark', get_template_directory_uri().'/dark.css' ); }
    	wp_enqueue_style( 'slanted-font-awesome', get_template_directory_uri().'/fonts/all.min.css' );
    	
    }

    Thanks for your help. Now I understand is the queue determine which loads first and which loads later that override the parent css.

    Let me know if I’m right or wrong. Thanks again.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘How do I override dark css style?’ is closed to new replies.