@import no longer best practice in setting up child theme style.css?

Hi Jean! I had the similar problem. I was able to refer to a different video that showed me that all I had to do was add the PHP tags in front of the code that Codex gives to put in the functions.php file. Here's some step by step instructions for you and anyone else who is trying to create a Child Theme page for their WordPress site:

Go to Workspaces which is the fifth icon on the left side of the Treehouse website. Click on New to create a new workspace and title it twentythirteenchild-directory. Create a new file and title it style.css. In this folder, copy and paste the code below:

/*
 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
*/

Replace the example text with the text that matches your site.

Instead of using the @import rule as discussed in the video, you will need to follow these instructions provided by codex.

Codex explains that you must create a separate file called fuctions.php. Create this file in your twentythirteenchild-directoy and then copy and paste this code in the functions.php:

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}

-If this does not work, then you have to paste this one in the functions.php file:

function theme_enqueue_styles() {

    $parent_style = 'parent-style';

    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 )
    );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );

What the code in the functions.php file does is it goes into your child theme and loads the stylesheet from the parent theme so that we continue to have the same styling inside of the child theme. -If the first PHP code does not work, you need to use the second one listed above. -If you have chosen a WordPress theme, and not a theme from another website or company, the first code is the one that will most likely work. Otherwise the second PHP code will work.

Once you’ve copied and pasted the functions.php code, you must be sure to add the PHP tags surrounding the WordPress action. This is what the code will look like with added PHP tags:

<?php

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}

?>

One important thing to note, do not include additional lines after the closing tag (end on line 9 or line 8) because this could lead to breaking your WordPress site.

After creating the files, download the files from the workspace and unzip the files in your download section (like you did when you downloaded WordPress). Within the unzipped file, copy both the style.css and functions.php files and paste them into the twentythirteenchild folder located inside of wordpress>wp-content>themes>twentythirteenchild.

Return to FileZilla. Be sure the Remote Site box still has the public_html folder opened and go to wordpress>wp-content>themes. Click on themes so the folders appear in the lower right hand box. Drag the twentythirteenchild folder into the lower right hand box with all the other theme folders. When doing so, the folder will be transferred to the server of your website.

To check and see if it was transferred correctly, go back into the dashboard of your WordPress site, go to Appearance then Themes, and you should now have a new theme called Twenty Thirteen Child.

Activate Twenty Thirteen Child theme and then click on Visit Site underneath the title of your WordPress Website to preview the page.

The page should look identical to the parent theme (twentythirteen). This is because, with the child theme code we added in the style.css file, we added the HTML code and the PHP code using our Template code (Template: twentythirteen). In the PHP file, we added the code for the styling of the page.

Although the child theme we’ve activated is identical to the parent theme, we can take the child theme and do whatever we want with it inside of the code. If you make any mistakes in the child theme, you can always refer back to the parent theme.

Hope this helps you! Feel free to ask me any questions or if you need any clarifications on this process.

Cheers, Laurie