Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Trent Burkenpas
Trent Burkenpas
22,388 Points
Posted by Trent Burkenpas
Trent Burkenpas
22,388 Points

How to edit the child themes css.

I know how to edit the style.css file. But how do I edit a css file inside the css folder? Do I need to go inside the functions.php file and deregister the stylesheet and then register the file?

here is the functions.php code I need to edit

function webriti_scripts()
    {   
        wp_enqueue_style('corpbiz-bootstrap-css', WEBRITI_TEMPLATE_DIR_URI . '/css/bootstrap.css');
        wp_enqueue_style('corpbiz-theme-menu', WEBRITI_TEMPLATE_DIR_URI . '/css/theme-menu.css');
        wp_enqueue_style('corpbiz-font', WEBRITI_TEMPLATE_DIR_URI . '/css/font/font.css');  
        wp_enqueue_style('corpbiz-font-awesome-min', WEBRITI_TEMPLATE_DIR_URI . '/css/font-awesome-4.0.3/css/font-awesome.min.css');    
        wp_enqueue_style('corpbiz-media-responsive', WEBRITI_TEMPLATE_DIR_URI . '/css/media-responsive.css');   

        wp_enqueue_script('corpbiz-menu', WEBRITI_TEMPLATE_DIR_URI .'/js/menu/menu.js',array('jquery'));
        wp_enqueue_script('corpbiz-bootstrap-min', WEBRITI_TEMPLATE_DIR_URI .'/js/bootstrap.min.js');

        if ( is_singular() ){ wp_enqueue_script( "comment-reply" ); }
    }
    add_action('wp_enqueue_scripts', 'webriti_scripts');

I want edit the bootstrap.css file.

Thanks for the help

Michael Leismeister
Michael Leismeister
3,706 Points
Michael Leismeister
Michael Leismeister
3,706 Points

The file would be found in the - folder css - called bootstrap.css - /css/bootstrap .css

Gabriel Ward
Gabriel Ward
20,222 Points
Gabriel Ward
Gabriel Ward
20,222 Points

Hi Trent,

I'm still learning myself, but my thinking would be to enqueue the specific file you want to edit into your functions.php?

1 Answer

Sue Dough
Sue Dough
35,800 Points
Sue Dough
Sue Dough
35,800 Points

Assuming the bootstrap is already working - You wouldn't have to do anything with the functions file. You would simply edit the CSS file like any other file. I must ask why you want to edit the bootstrap file? Usually you can make the edits you need in your theme css. It's considered a bad practice and should be avoided in most situations.

Trent Burkenpas
Trent Burkenpas
22,388 Points
Trent Burkenpas
Trent Burkenpas
22,388 Points

Well, the styling i need to change is in the bootstrap.css file. So If I try to edit it in the style.css, the bootstrap.css file overrides it, because it comes after style.css in the parent theme.

Sue Dough
Sue Dough
35,800 Points
Sue Dough
Sue Dough
35,800 Points

You can use bootstrap classes in your child theme to change things. You do not want to edit the bootstrap files. Make your CSS file load after bootstrap's.

Trent Burkenpas
Trent Burkenpas
22,388 Points
Trent Burkenpas
Trent Burkenpas
22,388 Points

ghost code how would I change the load order?

Sue Dough
Sue Dough
35,800 Points
Sue Dough
Sue Dough
35,800 Points

CSS loads from top down. So it should work fine as is it looks like.

Trent Burkenpas
Trent Burkenpas
22,388 Points
Trent Burkenpas
Trent Burkenpas
22,388 Points

ghost code well when I inspect the css code. The changes I made are crossed out. If you want you can check out the theme here is the link. I think the style.css file is being called before the bootstrap.css file

https://wordpress.org/themes/corpbiz/

Sue Dough
Sue Dough
35,800 Points
Sue Dough
Sue Dough
35,800 Points

Any way you can link the site and what your trying to do?