There are a bunch of tutorials that would work for you to add the custom logo to Genesis child theme. However, for my the last project, I had to write custom logo functions for a client site’s theme. Here is the step I added to functions.php:
- Add custom logo function
- Display custom logo function
- Remove title/logo metabox from Genesis theme options page function
- Remove title/logo metabox from Genesis customizer function
Add Custom Logo to Genesis Child Theme
So, here is the code snippet to add the custom logo to a child theme:
// Add custom logo or Enable option in Customizer > Site Identity add_theme_support( 'custom-logo', array( 'width' => 244, 'height' => 315, 'flex-width' => true, 'flex-height' => true, 'header-text' => array( '.site-title', '.site-description' ), ) );
After adding this code to your theme’s functions.php, you’ll see something like the screenshot below.
Select your logo and save it. Let’s display your logo now. Add the code below to display the custom logo that has selected already.
// Display custom logo add_action( 'genesis_site_title', 'the_custom_logo', 0 );
You’ll see your custom logo displaying as like as the screenshot below after adding the code of showing.
Okay, we have a metabox for selecting the option for the header; “Image Logo” and “Dynamic Text” in Genesis Theme Setting page. So, I think we don’t need that metabox anymore. Let’s remove it. Add the following function to your theme’s functions.php
function be_remove_metaboxes( $_genesis_admin_settings ) { remove_meta_box( 'genesis-theme-settings-header', $_genesis_admin_settings, 'main' ); } // Remove title/logo metabox from Genesis theme options page add_action( 'genesis_theme_settings_metaboxes', 'be_remove_metaboxes' );
I think we don’t need title/logo metabox in Genesis customizer also. So, here is the screenshot with red marking area going to remove.
Here is the code snippet to remove title/logo metabox from Genesis customizer:
function es_theme_customize_register( $wp_customize ) { $wp_customize->remove_control('blog_title'); } // Remove title/logo metabox from Genesis customizer add_action( 'customize_register', 'es_theme_customize_register', 99 );
We have done except adding a few CSS lines. If you want you could add them to your style.css
.wp-custom-logo .site-title { position: absolute!important; clip: rect(0,0,0,0); height: 0; width: 0; border: 0; overflow: hidden; } .wp-custom-logo .site-description { position: absolute!important; clip: rect(0,0,0,0); height: 0; width: 0; border: 0; overflow: hidden; }
Here is the full snippet of adding the custom logo to Genesis child theme:
// Add custom logo or Enable option in Customizer > Site Identity add_theme_support( 'custom-logo', array( 'width' => 244, 'height' => 315, 'flex-width' => true, 'flex-height' => true, 'header-text' => array( '.site-title', '.site-description' ), ) ); // Display custom logo add_action( 'genesis_site_title', 'the_custom_logo', 0 ); function be_remove_metaboxes( $_genesis_admin_settings ) { remove_meta_box( 'genesis-theme-settings-header', $_genesis_admin_settings, 'main' ); } // Remove title/logo metabox from Genesis theme options page add_action( 'genesis_theme_settings_metaboxes', 'be_remove_metaboxes' ); function es_theme_customize_register( $wp_customize ) { $wp_customize->remove_control('blog_title'); } //Remove title/logo metabox from Genesis customizer add_action( 'customize_register', 'es_theme_customize_register', 99 );
Leave feedback if you face there any issue. Thank you all. Happy coding!
You will love the following tutorials:
- How to Add Nofollow Tag to a Certain Domain
- How to Add Visitor Counter to Website in PHP
- How to Combine a Background Image and CSS3 Gradient on the Same Element
- How to Popup Genesis eNews Extended Opt-in Form
- 11 Genesis Framework Hacks for Beginner
- How to Use HTML Form [PHP]
- Starting with WordPress Metafields
- How to Store XML Data to PHP Variable
- How to Create Awesome Input Range Slider
- How to Make HTML Form Work and Send Mail
3 thoughts on “How to Add Custom Logo to Genesis Child Theme”
Very mush helpful, thanks for this awesome post
Hi,
The article is very much helpful. I was struck while installing the genesis theme. thanks for the help and adding the value.
The metabox for Theme Settings > Header > “Use for site title/logo” is still displaying. Is there something missing in the PHP code/