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 How to Make a Website with WordPress Customizing WordPress Themes Customizing WordPress Theme Files

highpriestess
highpriestess
5,486 Points
Posted by highpriestess
highpriestess
5,486 Points

Running WP locally - CSS changes not appearing

I have a folder in my child theme (style.css) with this in it:

/* Theme Name: Responsive Deluxe Child Theme URI: https://wordpress.org/themes/responsive-deluxe/ Description: Responisve Deluxe Child Theme Author: hp Author URI: http://example.com Template: responsive-deluxe Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: reponsive-deluxe-child */

@import "../responsive-deluxe/style.css";

h2{ font-family: 'Open Sans', sans-serif; }

highpriestess
highpriestess
5,486 Points
highpriestess
highpriestess
5,486 Points

Well...I solved the problem by simply adding a CSS plugin.

If there are plugins that do this why would I need to create a child theme?

4 Answers

Laurie Williams
Laurie Williams
10,174 Points
Laurie Williams
Laurie Williams
10,174 Points

It's difficult to know why your CSS isn't rendering in your theme without viewing your code. Can you share it with me on github? It seems like you are not properly enqueuing your stylesheets in your functions.php file.

"Well...I solved the problem by simply adding a CSS plugin. If there are plugins that do this why would I need to create a child theme?"

It's not a good idea to use plugins for basic functionality like stylesheets because plugins can slow down your website and present security vulnerabilities when they become outdated. It's considered bad practice and you should try to understand why Wordpress isn't rendering your stylesheet so that you can get a good understanding of how the CMS works.

The reason we use child themes in Wordpress is so that the code in our parent theme is never overwritten when we update it. Child themes make it really easy to extend functionality without losing the functionality in our parent theme.

Hope that helps.

Laurie

highpriestess
highpriestess
5,486 Points
highpriestess
highpriestess
5,486 Points

I have figured this out. If anyone else has the same problem this is what I did. (Yes, I was not properly enqueuing my stylesheet in your functions.php file.) This should work for you as well:

  1. Go to your "themes" folder (in "wp-content" folder)
  2. Create a new folder and name it something like this: "twentyfifteenchild". (If your parent theme is twentyfifteen.)
  3. Create a style.css file and save it in "twentyfifteenchild". In style.css put this:
Theme Name:   TwentyFifteen Child
Theme URI:    http://yourwebsite.com/twentyfourteen-child/
Description:  My first child theme, based on Twenty Fifteen
Author:       High Priestess
Author URI:   http://highpriestess.com
Template:     twentyfifteen
Version:      1.0.0
Tags:         Black, Custom Background, Custom Header, Custom Menu, Dark, Editor Style, Featured Images, Full Width Template, Gray, One Column, Photoblogging, Responsive Layout, Right Sidebar, Sticky Post, Theme Options, Threaded Comments, Translation Ready, Two Columns
Text Domain:  precious-lite-child
*/

Yes, it's just a comment. You will need to edit the Theme Name etc. to reflect your particular situation.
Theme Name and Template must be there. Copy and paste the tags from the parent template's style.css file.

  1. Now create another file and name it "functions.php". Save it in the "twentyfifteenchild" folder as well. In "functions.php" place the following code:

<?php add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' ); function enqueue_parent_styles() { wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' ); }

I did this and got it to work.

highpriestess
highpriestess
5,486 Points
highpriestess
highpriestess
5,486 Points

"It seems like you are not properly enqueuing your stylesheets in your functions.php file."

Ah....are there any instructions on how to do this? I haven't even touched that file.

highpriestess
highpriestess
5,486 Points
highpriestess
highpriestess
5,486 Points

Ok, I will have a look at that. Thank you