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!
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
Jesus Trevino720 Points
How to create the style.css file for a child theme that is derived from a premium theme?
I need help creating the style.css file when generating a child theme from a premium theme.
When creating the child theme folder, I get lost at the point in which we copy and paste the style.css file. In this tutorial video, the presenter copies this file from the "project downloads folder." In my case, I do not understand which file I should copy and paste into my child theme folder...
You see, I copied and pasted the style.css file from the premium theme folder and expected to see the code that appears in the video at minute 2:07 (i.e., file description in lines 1-9 and @import rule in line 11). However, when I open this copied style.css file in a text editor, the entire contents of the style.css file is displayed and there is no @import rule...
Any thoughts on where I am going wrong with the creation of the style.css file?
A.J. KandyCourses Plus Student 12,422 Points
The premium theme's CSS is the "parent" CSS.
The child theme's stylesheet needs to contain a specially formatted comment at the top that includes the parent theme's name, so that WordPress can identify it as such.
In this sample code from WordPress.org, the 'Template' line indicates the parent theme (twentyfifteen). If you look at your parent premium theme's CSS, you'll notice that it doesn't have this line.
/* Theme Name: Twenty Fifteen Child Theme URI: http://example.com/twenty-fifteen-child/ Description: Twenty Fifteen Child Theme Author: John Doe Author URI: http://example.com Template: twentyfifteen 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: twenty-fifteen-child */
You shouldn't need to use @import to make a child theme, unless you have partial stylesheets elsewhere that you need to bring into the child theme; you don't need to duplicate the parent. A child theme's CSS either adds to, or overrides, parts of the original.
More info at the WordPress Codex: https://codex.wordpress.org/Child_Themes#How_to_Create_a_Child_Theme
saransh mahajan283 Points
Even didn't understand, presenter should be more explicit and ended up googling the solution then what is the use of paying money to team tree house ?
Justin Gustafson13,633 Points
Sorry I agree with Saransh, it was completely unclear where the presenter got the info for the child css sheet. Extremely confusing. This answer above should have been in the video.