Mikey Arce

Change the default logo size for Storefront and it’s child themes

—

by

mikey
in ,

WordPress recently added the Custom Logo feature which is pretty neat.  Storefront 2.0 also added support for this recently.  By default, Storefront will set the logo to be 110 by 470 – which is pretty small.  If you want to make that bigger, you just need to override the theme function using something like this.


<?php
// Add this to your theme's functions.php
function marce_change_custom_logo_size() {
add_theme_support( 'custom-logo', array(
'height' => 400,
'width' => 400,
'flex-width' => true,
) );
}
add_action( 'after_setup_theme', 'marce_change_custom_logo_size', 30 );

view raw

storefront_custom_logo_size.php

hosted with ❤ by GitHub

Make sure you remove the opening php tag if that’s already in your functions.php file, and change the values of 400 to whatever you want.

Comments

8 responses to “Change the default logo size for Storefront and it’s child themes”

  1. Mike Avatar
    Mike

    Thanks Mikey, worked great.

    Reply
  2. J Avatar
    J

    Thank you for the help!!

    Reply
  3. Laurie Avatar
    Laurie

    Exactly what I needed. Thank you!

    Reply
  4. Lavanya Avatar
    Lavanya

    hello, i am new to php and wordpress i added the above code into funtions.php but it is not changing the size. Can you please help me/

    Reply
    1. mikey Avatar
      mikey

      Hi Lavanya, instead of adding it to your functions.php try maybe using a plugin like Functionality:
      https://en-ca.wordpress.org/plugins/functionality/

      Also make sure that there is only one opening “

      Reply
  5. Björn Avatar
    Björn

    Hi Mikey 🙂

    I have the exact same issue like Lavanya. I am using the plugin ‘theme-customisation-master’ to avoid updates overriding my previous changes. I already tried with ‘custom-logo-link’, ‘logo’, ‘h1.logo’ and ‘a.custom-logo-link’, but nothing did the trick. Any ideas where I might be wrong?

    And as always- thank you very much!

    Reply
    1. Björn Avatar
      Björn

      I found another solution, but am not really satisfied. The result would be the same with your snippet (I guess).
      The reason I am not satisfied is due to the fact, that with adding a logo it will be resized. Making it bigger afterwards makes my logo a bit blurry.
      Isn’t it possible to change the path to the image? Or avoid cropping another way?

      Reply
      1. mikey Avatar
        mikey

        Try using regenerate thumbnails to see if that helps!

        Reply

Leave a Reply