• Trying to make the site logo bigger and not sure what I am missing.

    Added this to the functions file:

    function harmonic_child_site_logo() {
      add_image_size( 'harmonic-site-logo', '500', '500' );
    }
    add_action( 'after_setup_theme', 'harmonic_child_site_logo', 11 );

    And then added this to the CSS:

    img.site-logo {
    	height: auto;
    	max-width: 500px;
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    	margin-top: auto;
    }

    No change, any idea what I missed?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Hi there,

    Harmonic defines the size of its logo with the following function in its /inc/jetpack.php file:

    add_image_size( 'harmonic-logo', 1000, 250 );

    In your child theme’s functions.php file, you will therefore need to use harmonic-logo (not harmonic-site-logo):

    function harmonic_child_logo() {
    ??? add_image_size( 'harmonic-logo', 500, 500 );
    }
    add_action( 'after_setup_theme', 'harmonic_child_logo', 11 );

    After you have saved your changes, you may need to use the following plugin to regenerate your thumbnails before noticing a change:

    https://www.ads-software.com/plugins/regenerate-thumbnails/

    Let me know how you get on with those steps or if you have any extra questions while walking through them.

    Thread Starter megan.bares

    (@meganbares)

    that worked, but now it looks insanely large on mobile. thoughts?

    @megan.bares: Could you please remember to include a link to your site in your support threads? I checked through your history to get the link to 815catholic.com but it’s a timesaver and much easier for us to help if you can include it in each of your threads.

    that worked, but now it looks insanely large on mobile. thoughts?

    You could make use of a media query in order to target certain devices. For example, the following media query would only target devices that are 640px in width or larger:

    @media only screen and (min-width: 640px) {
        img.site-logo {
            max-width: 500px;
        }
    }

    Further information on media queries can found here:

    Let me know if you have extra questions, too. ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Enlarge size of logo.’ is closed to new replies.