Site logo

Archived topic

GP 2.0 bug? (Retina logo https problem)

12 replies · Started by Zach on December 5, 2017

Viewing posts 1–13 of 13

After upgrading to GP 2.0 (current version is rc.1 as of posting date) I've noticed that the srcset attribute of the site logo isn't creating a https link for the 2x version. Example:

srcset="https://www.zachpoff.com/site/wp-content/uploads/headphones-logo-64px.png 1x, http://www.zachpoff.com/site/wp-content/uploads/headphones-logo-128px.png 2x"

My server is set up to disable mixed content so my retina logo is dropping out. My apologies if this is actually some kind of server problem, but it seems like GP to me.
-Zach

Hi Zach,

Thanks for testing!

The URL should inherit the domain name set in "Settings > General". Can you make sure both of those URLs have https?

I actually didn't have those set to https! After I fixed them, the problem persisted (cleared cache, tried several browsers) until I removed / re-added the retina logo in Customizer. Now the logo appears. (It's interesting that the 1x link was always https but the 2x link was http.)

One more problem: In Firefox 57 the div with class "site-logo" is too wide when viewed on retina screens. It matches the width of the original logo file (128px) instead of the scaled size that the logo actually appears (64px). Just to be clear, the logo is scaled correctly, but it's parent div is too wide. (In Safari and Chromium this problem does not appear.)

-Zach

Yea - the Customizer saves the value that gets set by the uploader. If the value was set as http, it needs to be re-uploaded.

As for the other issue - can you link me to an example? I can't reproduce that.

Let me know :)

https://www.zachpoff.com/site/
Compare Firefox 57 to other browsers. FF renders a lot of space between the logo and the site branding.
-Zach

Strange - I don't have a retina screen, but Firefox Quantum allows us to mimic a retina screen by applying a device pixel ratio (DPR) of 2: https://www.screencast.com/t/VSxHNoiA

Yes, looks like a long standing Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1149357

Can you test this as a workaround?

add_filter( 'generate_logo_attributes', 'tu_fix_firefox_logo_width' );
function tu_fix_firefox_logo_width( $atts ) {
    if ( function_exists( 'the_custom_logo' ) && get_theme_mod( 'custom_logo' ) ) {
        $data = wp_get_attachment_metadata( get_theme_mod( 'custom_logo' ) );

        if ( ! empty( $data ) ) {
            $atts['width'] = $data['width'];
            $atts['height'] = $data['height'];
        }
    }

    return $atts;
}

Works great. Thanks.

No problem! I'll get this added into the core theme after some more testing.

2.0.1 was just released with this fix.

Thank you! :)

Fixed. Sorry :)

No problem! :)

This archived topic is closed to new replies.