Installing & Activating a Child Theme

Child Theme

Loyde offers a rich and comprehensive set of settings, which can be customized righ from the WordPress dashboard, through Loyde Theme Options. However, there will always be some things that can't be edited through WP admin. In that case, it'll be necessary to use a child theme. That way, the changes will remain even after the parent theme (i.e. Loyde) is updated.

How to install & activate Loyde child theme

note

Loyde already comes with the child theme. It's part of the download package from ThemeForest.

Child Theme

Steps:

  1. Download the latest theme version from ThemeForest. It's necessary to download the main package .zip archive, not the installable file .zip arhive
  2. Extract the .zip archive to disk. There will be a subfolder, loyde-child
  3. Copy the child theme to the server and activate it.

Customization through a child theme: an example

Below we'll illustrate two examples for customizing WooCommerce, one of the most popular e-commerce plugins for WordPress. But similar steps could be taken other WordPress plugins, and even the core functionality of WordPress itself.

How to customize WooCommerce Shop page

Steps:

  1. Copy Loyde child theme to your server;
  2. Activate Loyde child theme instead of Loyde;
  3. Copy file woocommerce.php to your child theme. Original location of woocommerce.php: /wp-content/themes/loyde/woocommerce.php. Location of the copied file: /wp-content/themes/loyde-child/woocommerce.php
  4. Customizing this PHP file will modify the way Shop page is presented.

How to customize WooCommerce single product page

Steps:

  1. Copy Loyde child theme to your server;
  2. Activate Loyde child theme instead of Loyde;
  3. Inside the child theme, create a subfolder called woocommerce (if it doesn't already exist)
  4. Copy file single-product.php to your child theme. Original location of single-product.php: /wp-content/plugins/woocommerce/templates/single-product.php. Location of the copied file: /wp-content/themes/loyde-child/woocommerce/single-product.php
  5. Customizing this PHP file will modify the way single product is presented.

How to customize WooCommerce elements using a corresponding hook

This is considered an advanced modification, since it's necessary to already know how WordPress hooks work and how to change PHP code. The following steps will add a custom text to the WooCommerce checkout page. Steps:

  1. Copy Loyde child theme to your server;
  2. Activate Loyde child theme instead of Loyde;
  3. In the child theme, open functions.php in a text editor
  4. Add this code to functions.php:
add_action( 'woocommerce_before_checkout_form', 'loyde_child_checkout_message' );
function loyde_child_checkout_message() {
echo '<p>Please double-check if all required fields are filled. Thanks!</p>';
}