Do you want to Build a Child theme for your Genesis Framework ?

Yes !

Read out how you can make it !

If you are using WordPress as your blogging platform then you must have experimented with various themes so far. Did it ever occur to you that you may also be able to get a customized theme of your own? If yes then you must have given it a thought. However, if you are not sure how you can get a WordPress theme of your own then you are going to find some useful information in this post.

genesis_preview.__large_previewI’m going to tell you how you can create a child them of genesis framework by yourself. There are various advantages of having your own child theme like, your theme will have only those features that you need and secondly, you can also make any changes in future easily.

Don’s miss : Installing of wordpress manually AndHow to start a blog.  

Let us start building our own child genesis theme

There is an action called wp_footer in WordPress that allows you to add some information in footer of your page easily. You will have to add this action in your function.php file. For example, if you want to add your Google Analytics code in the page, you can do it as follows.

function

There is a filter excerpt_length that lets you decide how much text will be displayed when you use the_excerpt() in your theme. You can modify it by putting it in your functions.php file.

Genesis function

Start Building Your First Child Theme

The steps that you should carry out are mentioned below.

  1. Create a subdirectory for the child theme project on your site
  2. Install WordPress and Genesis
  3. Entire functionality of website should be built in to the theme
  4. Use proper CSS to make output look similar

Creating the Child Theme

Go to /wp-content/themes and here you should create a spare directory for your child theme. Give it a name like “childtheme”. There are only two files that you are going to need for your child theme and these are functions.php and style.css. If you want, you can write a completely new style sheet for your website but a good option will be to modify the existing file.

Go to /wp-content/themes/genesis/style.css and copy it to /wp-content/themes/childtheme/style.css. Make sure you don’t use @import in CSS because it will sync your child theme with parent theme and you don’t want it to happen.

Look at the top of your stylesheet to change the information. You should put Template: genesis because this is how you can define it as a child theme.

function on genesis theme

functions.php file:

function.php

Customizing the Child Theme

Your child theme is now activated but you still need to customize it for your use. Below, you will find some important information about theme customization.

This is what we will do

  • Update Theme Settings
  • Building The Menu
  • Setting up content area for Home Page
  • Create Footer Area

Update Theme Settings

The good thing about genesis is that, it allows you to control many features directly from WordPress backend so you don’t have to go into coding again and again. Find this option in t Genesis > Theme Settings.

Here you will find all those things that you can change in theme like the header logo, the home screen image and many other things as well.

Building the menu

If you want, you can create your own menu but it is not necessary. You can leave this step if you don’t desire to have a customized menu of your own. Below is a code that I used to combine a primary and a secondary menu inside the header.

menu.php

Setting up the content area for Home Page

Since our Home page is going to be static and it doesn’t show recent posts so I will go ahead and create a page called Home.

home page.php

Next, I will create the content area. First, you will have to remove the default loop, genesis_do_loop() and replace it with our own, be_home_loop(). After all the tweaking, this is how the functions.php file will look like.

footer1

Footer2

footer3

footer4

footer5

footer6

footer7

This is the final customization that we need to do. In this section, we will be creating a footer file. The customization will be made in functions.php file.

Following code will add search feature in footer area.

final footer

That’s it. We have successfully created our own child theme of genesis. There are many functions which are not added in this theme but you can make any changes as per your mind. You can also ask an efficient web design company to make a child theme according to your demands as well. If you have any more suggestions then let us know. Thank you

 

Saif Ullah is an SEO & Internet Marketing expert working as a social media marketing manager. He loves to play with gadgets and Google. He has been running Saif Ullah Butt for sharing his personal adventures in Internet life. You can catch him on Facebook. Do you want some guidelines in SEO ? Get Quote Now for SEO !

Facebook Twitter LinkedIn Google+ YouTube