How to Create a Child Theme for the BuSo Lightning WordPress Theme in 3 Easy Steps

[paulcarl]

You need a child theme to make changes to your WordPress website that won't be lost when your BuSo Lightning theme is updated or when the WordPress CMS is updated. This guide will show you how to get your child theme setup. This guide is a good supplement to what you should have learned from Day 4 - Setting Up Your Website and it will also allow you to take advantage of these helpful (and copy/pasteable) functions.php code snippets.

ASSUMPTION
This guide assumes that you know how to use FTP. I use WinSCP because it's free and it's what I got used to. If you don't know what any of this means, let me YouTube it for you.

STEP 1 - CREATING YOUR DIRECTORY
Navigate to your WordPress directory on your server and find your themes folder under /wp-content/themes/
Click on the pretty little "new folder" icon (top arrow) or press f7 and create a new folder entitled "busolightning-child" (second arrow).

​

STEP 2 - CREATING YOUR FILES
Now open the child theme folder you just created and create the file "style.css" (in WinSCP, you can do this with "right click > new > file" or by pressing shift+f4). In your style.css file, paste the following text:

/*
Theme Name: Buso Lightning Child Theme
Author: Builder Society
Description: The Fastest WP Theme Ever
Tags: White, Blue, Light
Template: busolightning
Version: 2.0
Text Domain: buso
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
BuSo Lightning, Copyright 2015-2016 BuilderSociety.com
BuSo Lightning is distributed under the terms of the GNU GPL
*/

You should also create functions.php in your child theme's folder. WinSCP doesn't let you create a blank file, so here's so commented code you can paste into yours to get you started. I use this to keep all of my functions.php additions organized.

<?php

// =============================================================================
// TABLE OF CONTENTS
// -----------------------------------------------------------------------------
//   01. Enqueue Parent Stylesheet
//   02. Security
//   03. Tracking Scripts
//   04. Speed
// =============================================================================

?>

Make sure that all of the code you add you to your functions.php file stays within the <?php opening tag and the ?> closing tag.

*Side note: if you make edits to your CSS in your child theme's style.css file, you may need to enqueue your parent stylesheet for it to work. I'm planning on editing all of my CSS in the BuSo Lightning theme's built in CSS field so I shouldn't have any issues. Maybe a WordPress vet can weigh in on this potential issue in the comments?

For my fellow visual learners, here's what your child theme directory should look like in WinSCP:

STEP 3 - ACTIVATE YOUR CHILD THEME AND GET TO WORK
Now go to your Themes menu in your WordPress backend, you should see this:

​

Just activate your child theme and you're good to go. You can now edit these child theme files from the WordPress editor.

Good job. Now we can both get back to grinding.

 

[Nat]

Top of Functions.php if you're not editing the BuSo style.css

// enqueue styles for child theme
function buso_enqueue_styles() {
    wp_enqueue_style('parent-theme', get_template_directory_uri() .'/style.css');
    wp_enqueue_style('child-theme', get_stylesheet_directory_uri() .'/style.css', array('parent-theme'));
}
add_action('wp_enqueue_scripts', 'buso_enqueue_styles');