Adding Logo in Balance

[Jorn Trommelen]

Hi,

I'm struggling to add a site logo to my Balance theme. To my surprise, there is no easy way to do it.

- There does not seem to be a plugin (there are some, but they are all very old and are not kept up to date)
- I've seen some sources reference FTP, which I have never worked with and would rather not touch.
- I found a pretty easy youtube tutorial, but unfortunately, it does not work for me. I've followed all the steps, but in the end get the standard Genesis framework 5html standard logo. Any clue what I could be missing here? I've put the Balance theme in the logo icon mode, uploaded a .png, and copied the URL like this:

.header-image .site-title > a {
background: url(images/logo.png) no-repeat left;
float: left;
min-height: 60px;
width: 100%;
}

I've changed it to:

.header-image .site-title > a {
background: url(http://www.nutritiontactics.com/wp-content/uploads/2017/08/[email protected]) no-repeat left;
float: left;
min-height: 60px;
width: 100%;
}

But it does not work (I get the Genesis framework supports 5html standard logo).

Thanks,
Jorn

http://www.nutritiontactics.com/

[Erika]

Hi Jorn,

Use this code to make the default title disappear by replacing the original:

.site-title a, .site-title a:hover {
color: #333;
display: none;
}

Then, use this code to make your logo appear, replacing the original:

.title-area {
float: left;
padding: 45px 0px;
background: url(http://www.nutritiontactics.com/wp-content/uploads/2017/08/[email protected]) no-repeat left;
background-size: contain;
}

Adjust the bold part of the padding to control the size of your logo. I hope this helps!

[Victor Font]

The Balance theme has built-in support for a custom 900x135 header logo. You add the image through the WordPress Appearance/Customize page in the Header Image area. There's no reason to ever touch code when adding/changing a logo in a Genesis theme unless you want a different size than the default, in which case follow these instructions: https://victorfont.com/change-logo-size-in-genesis-themes/

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Jorn Trommelen]

Hi Victor,

Unfortunately, 'Header Image area' does not appear under the appearance/customize page. I've seen several articles mention is and saw it in screenshots, so I know what I'm looking for but it's not there.

@Erika

Thanks for the help. Unfortunately, it still doesn't seem to work.

.site-title a, .site-title a:hover {
color: #333;
display: none;
}

The above does not seem to work, as the standard Genesis logo is still appearing.

I've changed the original .title-area for the code you suggest, but it does not seem to work. In addition to the coding you suggest, do I still need to make any changes to:

.header-image .site-title > a {
background: url(images/logo.png) no-repeat left;
float: left;
min-height: 60px;
width: 100%;

Either the above code, or replacing the URL to http://www.nutritiontactics.com/wp-content/uploads/2017/08/[email protected] does not seem to work. Or do I remove this altogether?

Thanks so much for all the help so far!
Jorn

[Victor Font]

There is no standard Genesis logo unless you are talking about the favicon. Is that what you mean?

To make sure you have the header image area in the WOrdPress customizer, make sure theme support for custom header is active. You should see the following code in the Balance theme's functions.php at line 34:

/** Add support for custom header */
add_theme_support( 'genesis-custom-header', array( 
	'width'	=> 960, 
	'height'	=> 135 
) );

If that code is there, the header-image area has been activated for your theme. If you can't see it, it suggests a plugin conflict.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[Author]

Posts