![\"\"](\"http:\/\/leaguewp.com\/wp-content\/uploads\/2017\/08\/Screenshot-2017-08-10-12.54.27.png\")
<\/p>\n
When your logo designer hand over a logo file, it must be larger than the specified header dimension of your Genesis theme. You can’t use the same logo directly because you will need to crop your logo to fit the specified header dimension.<\/p>\n
![\"\"](\"http:\/\/leaguewp.com\/wp-content\/uploads\/2017\/08\/Screenshot-2017-08-10-12.56.22-e1502356464532.png\")
<\/p>\n
So, you will need to resize your logo with the help of a tool. My favorite tool for resizing images and logos is PicMonkey.com.<\/p>\n
Here’s how to go about it.<\/strong><\/p>\n Go to PicMonkey.com, and resize your logo. Upload your logo and change the value of your height. For example, in the screenshot above, my header had a 3979 x 1848 pixels. So we need to replace 1848 pixels with 160 pixels. When we do that, the width will automatically change to 344 pixels (see screenshot below).<\/p>\n Then we will click on Apply button and then click on Export button to download the resized logo for your Genesis header.<\/p>\n The next step is to upload the resized logo. Go to Customize > Header in Genesis Theme. Here, you can upload your resized logo.<\/p>\n Add the new logo and click on Skip Cropping to see your logo appear in the header section.<\/p>\n That’s it! Save your work and refresh your browser to see your new logo appear on the header.<\/p>\n Here’s what it looks like:<\/p>\n At times, you might want to use a custom height for your logo. Recently, a Genesis WordPress Facebook Community member wanted help for this exact situation.<\/p>\n I am trying to set logo size to something bigger, let’s say maybe 600x400px. I have edited the code in functions.php accordingly, but my image always stays the same. Any thoughts?<\/p><\/blockquote>\n In such a case, you need to go to your functions.php and change value of your default header.<\/p>\n Find the following code in your functions.php<\/p>\n And change the value of width and height as shown below. You can add any value as per the width and height of your custom logo. Save your work and refresh your browser.<\/p>\n","protected":false},"excerpt":{"rendered":" It’s important to know how to use a logo in Genesis theme header. Learn how to resize a logo and tweak theme code to achieve the desired results. <\/p>\n","protected":false},"author":2,"featured_media":339,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","footnotes":""},"categories":[3],"tags":[11],"yoast_head":"\n![\"\"](\"http:\/\/leaguewp.com\/wp-content\/uploads\/2017\/08\/Screenshot-2017-08-10-14.49.50.png\")
<\/p>\n![\"\"](\"http:\/\/leaguewp.com\/wp-content\/uploads\/2017\/08\/Screenshot-2017-08-10-13.14.00-1-e1502358984104.png\")
<\/p>\nUsing a Custom Height for Logo in Genesis Header<\/h2>\n
\/\/ Add support for custom header.
\n add_theme_support( 'custom-header', array(
\n 'width' => 600,
\n 'height' => 160,
\n 'header-selector' => '.site-title a',
\n 'header-text' => false,
\n 'flex-height' => true,
\n ) );<\/code><\/p>\n
\n\/\/ Add support for custom header.
\n add_theme_support( 'custom-header', array(
\n 'width' => 640,
\n 'height' => 520,
\n 'header-selector' => '.site-title a',
\n 'header-text' => false,
\n 'flex-height' => true,
\n ) );<\/code>
\nOne you’re done with it, find the following code in your css file.
\n.header-image .site-title > a {
\n background-position: center !important;
\n background-size: contain !important;
\n float: left;
\n min-height: 80px;
\n width: 100%;
\n }<\/code>
\nAnd change the value of minimum height to whatever size you have in your custom logo. For the sake of this example, we will change the minimum-height to 400px.<\/p>\n