How To Create A Custom Genesis Child Theme 2017

Would you want to build your own genesis child theme for your blog?

Would you want to customize genesis child theme?

Are you looking for a detailed to for creating an outstanding custom genesis theme?

If your answer is yes then here I am going to share complete steps and guide to create a new genesis child theme. You can customize child theme as you want. Before this you have need genesis freamwork. You can buy genesis freamwork from studiopress.Create An Outstanding Custom Genesis Child Theme

Why should I design my own child theme

The very first question is arising in your mind that why should I desigin a genesis child theme. So here is answer,

bloggingrocket-theme

  1. StudioPress updating genesis freamwork regularly. So if you customize genesis parent theme then at time of update you will lose all customization.
  2. If you want to setup your blog as a brand like dsdm.in, Blogging Rocket and shoutmeloud, you need a very unique theme design.
  3. In child theme, there is no encrypt and useless codes. So you theme will load faster.
  4. If you want to learn wordpress theme development, then you can learn a lot by these experiments.

So, here is how to create a simple genesis child theme.

In child theme we need just 2 files, function.php, style.css. Next if we planned to design custom templates, then we need files like header.php, main-page.php, blog-page.php etc.

Step:1  First create two files in notepad { function.php and style.css}. If you want to use your own theme screenshot then rename your logo with screenshot.php. We are doing this in notepad.

Now open function.php and paste following codes and save it.

<?php
//* blogging rocket genesis theme
include_once( get_template_directory() . ‘/lib/init.php’ );

define( ‘CHILD_THEME_NAME’, __( ‘Blogging Rocket Pro Theme’, ‘rocket’ ) );
define( ‘CHILD_THEME_URL’, ‘http://bloggingrocket.com/’ );
define( ‘CHILD_THEME_VERSION’, 1.0.0′ );

Step: 3 Now open genesis parent theme and navigate style.css. Copy this folder to newly created style.css

Step: 4  Next make a zip file by combining above files{ function.php, style.css and screenshot.png}

Congrats, our genesis child theme is ready.

Next go to your wordpress dashboard and upload child theme. When you active this theme you will see same theme as genesis parent theme.

It is a simple genesis child theme. You can also get free genesis  child theme from studioPress.

Now you are thinking that what the hell. To build a strong theme we need to customize function.php and style.css files. You can edit them from editor panel or via ftp.

Here I am sharing few codes for normal customization. All these codes  will go to function.php

genesis-theme

1. Move Primary Navigation Menu Before Header

If you want to move primary menu before header, then use these codes.

/** Move Primary Navigation Menu Above Header */ remove_action( 'genesis_after_header', 'genesis_do_nav' ); add_action( 'genesis_before_header', 'genesis_do_nav' );

2.Move Secondary Navigation Menu above Header

This code is used to move secondary menu before header.

/** Move Secondary Navigation Menu Above Header */ remove_action( 'genesis_after_header', 'genesis_do_subnav' ); add_action( 'genesis_before_header', 'genesis_do_subnav' );


3.Remove Primary Navigation Menu on Home Page

//* Remove the primary navigation menu on home/front page
remove_action( 'genesis_after_header', 'genesis_do_nav' );
add_action( 'genesis_after_header', 'myg_do_nav' );
function myg_do_nav() {
if ( is_home() || is_front_page() )
return;
genesis_do_nav();
}

4.Remove Both Primary and Secondary Navigation Menus on Home page

remove_action( 'genesis_after_header', 'genesis_do_nav' );
remove_action( 'genesis_after_header', 'genesis_do_subnav' );
add_action( 'genesis_after_header', 'myg_do_nav' );
function myg_do_nav() {
if ( is_home() || is_front_page() )
return;
genesis_do_nav();
genesis_do_subnav();
}

5.Add Custom logo to Genesis child theme

add_theme_support( 'genesis-custom-header', array( 'width' => 960, 'height' => 100 ) );

6.Remove Genesis Header From Front Page Only

add_action( 'genesis_before_header', 'myg_remove_header_home' );
function myg_remove_header_home() {
if ( ! is_front_page() ) {
return;
}
remove_action( 'genesis_header', 'genesis_header_markup_open', 5 );
remove_action( 'genesis_header', 'genesis_do_header' );
remove_action( 'genesis_header', 'genesis_header_markup_close', 15 );
}

7.Register a Beautiful Genesis Footer

/** Add support for 4-column footer widgets **/ add_theme_support( 'genesis-footer-widgets', 4 );

8.Remove Genesis Footer Credits Links

/** Customize or remove the Genesis footer credits links */
add_filter('genesis_footer_creds_text', 'custom_footer_creds_text');
function custom_footer_creds_text($creds) {
    $creds = ' 2015 My Genesis Themes</a>';
    return $creds;

9.Re position Genesis Breadcrumbs

//* Reposition breadcrumbs from before .entry to inside .entry (above title) on single Posts and static Pages
add_action( 'genesis_before_content', 'myg_reposition_breadcrumbs' );
function myg_reposition_breadcrumbs() {
if ( is_singular() ) {
remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );
add_action( 'genesis_entry_header', 'genesis_do_breadcrumbs', 9 );
}
}

10.Modify Speak your Mind Text for Comments

add_filter('genesis_comment_form_args', 'custom_comment_form_args');
function custom_comment_form_args($args) {
  $args['title_reply'] = 'Leave a Comment';    // $args['title_reply'] = ''; for total removal
  return $args;
}


11.Change Comment Box Position to Above Comments

add_action( 'genesis_before_comments' , 'wps_post_type_check' );
function wps_post_type_check () {
if ( is_single() ) {
if ( have_comments() ) {
remove_action( 'genesis_comment_form', 'genesis_do_comment_form' );
add_action( 'genesis_list_comments', 'genesis_do_comment_form' , 5 );
}
}
}

12.Remove URL Field from Comment Form

add_filter( 'genesis_comment_form_args', 'myg_comment_form_args' );
function myg_comment_form_args( $args ) {
unset( $args['fields']['url'] );
return $args;
}

13.Remove HTML allowed Tags in Genesis

function remove_comment_form_allowed_tags() {
add_filter('comment_form_defaults','wordpress_comment_form_defaults');
}
function wordpress_comment_form_defaults($default) {
unset($default['comment_notes_after']);
unset($default['comment_notes_before']);
return $default;
}

14.Remove Post Info in Genesis Theme

remove_action( 'genesis_entry_header', 'genesis_post_info', 12 );

15.Remove Post Meta in Genesis Theme

remove_action( 'genesis_entry_footer', 'genesis_post_meta' );

16.Add Custom Featured Image Size

//* Add image sizes for slider and home page
add_image_size( 'slider', 1140, 445, TRUE );
add_image_size( 'home-widgets', 293, 150, TRUE );
add_image_size( 'related', 100, 100, true );

17.Change Search Box Text in Genesis

/** Customize search form input box text */
add_filter( 'genesis_search_text', 'custom_search_text' );
function custom_search_text($text) {
    return esc_attr( 'Search my genesis themes' );
}


18.Add Last Updated Post Date in Genesis

//* Add last updated date to the post info in entry header
add_filter( 'genesis_post_info', 'myg_post_info_filter' );
function myg_post_info_filter($post_info) {
if (get_the_modified_time() != get_the_time()) {
$post_info = $post_info . '<br/>Last updated on: ' . the_modified_date('F j, Y', '', '', false);
}
return $post_info;
}

19.Remove Primary Sidebar in Genesis

/** Unregister genesis primary sidebar */
unregister_sidebar( 'sidebar' );

20.Remove Secondary Sidebar in Genesis

/** Unregister Genesis secondary sidebar */
unregister_sidebar( 'sidebar-alt' );

 

These are some basic codes for editing genesis theme.

Final Words: I wrote almost complete guide for creating custom genesis theme . However if you are facing ang problem, feel free to drop comment here.

23 Comments

  1. Arvind July 25, 2016
  2. Jaidayal Saraswat July 26, 2016
    • Prabhat Jani July 26, 2016
  3. Shaikh Masood Alam July 26, 2016
    • Prabhat Jani July 26, 2016
      • Shaikh Masood Alam August 18, 2016
  4. Lara July 26, 2016
  5. Anmol Singhi July 27, 2016
  6. Babanpreet Singh July 30, 2016
  7. Erick Hachey August 29, 2016
  8. Akash Tyagi September 4, 2016
    • Prabhat Jani September 5, 2016
  9. Daksh Miglani October 16, 2016
  10. rohaan October 27, 2016
    • Prabhat Jani October 27, 2016
  11. Bheru Lal Gaderi November 1, 2016
  12. vijaygopal November 15, 2016
  13. Suresh December 3, 2016
    • Prabhat Jani December 3, 2016
  14. Sanket Maheshwari February 25, 2017
  15. pankaj bishnoi July 7, 2017

Add Comment