Genesis framework is one of the most popular choices for WordPress theme development. Why does it beat other frameworks on the market? Please refer to my detailed comparative analysis of Genesis and other frameworks.
In this tutorial, we’ll cover the steps to install Genesis Framework and Child Theme on WordPress. Before continuing with this introduction to the framework and its application, let us first get familiar with some basic definitions:
A Theme Framework is a powerful (and very basic) theme that is designed to be customized into highly specialized child themes. You could read more on the topic at How Genesis framework became so famous and powerful
Child themes are developed using theme frameworks such as Genesis. These themes incorporate the functionality of the parent framework theme and the aesthetics and customizations of a custom-developed theme. You could read more about the topic here.
Child theme elements are grouped inside a folder, usually known as child theme directory. In Genesis, the following files are part of the theme structure:
Front Page (front-page.php): This file is used to develop a widget based or custom homepage.
Functions File (functions.php) (required): This is the connector between the child theme and the framework. It is used to add, remove and modify default framework elements.
Style sheet (style.css) (required): Website styling that generates the looks of the website is stored in this file.
Images (optional): All the images used in theme development and website CSS are stored here.
Screenshot: this is an image of how the theme looks when deployed on the website.
Part – 1
Installing the Genesis Framework and the Child Theme
The first step is the installation of the Genesis Framework.next, the child themes are uploaded. Both these steps resemble the installation of any other WordPress theme. There are two ways of uploading the framework and the child themes:
- Via upload feature of the WordPress Dashboard (Recommended)
- Via FTP Client
Let’s see how both these methods work:
IMPORTANT: If your site is hosted on WordPress.com (example: mysite.WordPress.com), you cannot install the Genesis Framework or new themes. This is a restriction on WordPress.com-hosted sites.
1 – Via uploads feature from WordPress Dashboard (Recommended)
The process of uploading using the option of WordPress Dashboard has six easy steps. This process is also valid for the child theme as well.
- From the WordPress, Dashboard go to Appearance > Themes.
- Click the Add New button at the top of the page.
- Click the Upload Theme button.
- Click the Choose File button and browse to the theme file stored on the local computer. Make sure that it is a zip file that is correctly named with the name of the framework or the theme (example: genesis.zip or genesis-sample.zip).
- Click the Install Now button.The framework theme is now installed, and three options will appear:
- Live Preview: Shows how your website will look after applying this theme.
- Activate: Activates the newly applied theme.
Note: When installing Genesis Framework, DO NOT activate it. However, activates the child theme.
- Return to Themes page: Brings you back to the main theme page.
- Genesis Framework is now installed. Click Return to Themes page to install and activate the child theme.
2 – Via FTP Client
You can also install Genesis Framework and a child theme manually using the FTP. Some options for using the FTP service are:
Unzip the Genesis Framework and the child theme to separate folders on the computer’s desktop. Now connect to your site via FTP.
After connecting via FTP, browse to wp-content > themes folder
Upload the entire unzipped Genesis folder from the desktop to the themes folder on the server.
- The folder must be named Genesis and NOT “Genesis 2.0” or anything else.
- The Genesis folder cannot be nested inside another folder.
Follow the above steps for uploading the child theme as well.
Activating the Child Theme
After Genesis and the child theme have been uploaded, it is time to activate the child theme. You must not activate Genesis theme, as it runs silently in the background.
If you have installed the child theme via the WordPress Dashboard, click Activate after the theme has been uploaded.
If you have opted for the FTP, go to Appearance > Themes and hover over the installed theme and click the Activate button.
Now the theme is active and can be customized as per your requirements. This will be covered in the next installment.
I hope this article helped you in understanding how one can install and configure Genesis Framework for designing a Genesis Based Theme. My upcoming article is where I will be discussing in detail on how to configure the basic settings of the Genesis Framework.
If you need clarification about any step discussed above, please leave a comment.
Danish was a WordPress Community Expert at Cloudways - A Managed WordPress Hosting Platform. He loves helping out WordPress beginners and solving their problems. His passions takes up his free time as well and he spends time designing, developing and learning new stuff. You can email him at firstname.lastname@example.org
Be the first to check out WordPress 5.0
Use our Staging feature before upgrading your website to WordPress 5.0.