XF 2.2 Logo uploaded

Brad P

Well-known member
Morning all,

I’ve updated my logo via the style properties but for some reason it’s displaying tiny? Any idea on how to make it look bigger? It’s tiny on mobile view too.
 

Attachments

  • E2A72CC8-4A74-4913-8FD2-8F67F2B629C2.webp
    E2A72CC8-4A74-4913-8FD2-8F67F2B629C2.webp
    60.9 KB · Views: 19
It displays fine in the dark style.

However, the styles you are using have the logo on the same row as the navigation, so there is almost no room available.

Therefore this is to be expected.

1640092532585.webp
 
I've been testing my site with Chrome recently, I rarely use it and with the default style the logo is small.
It's been bothering me but the logo looks fine in Firefox with every style and in Chrome with all of the other styles except for the default XF.

I'm wondering how I can fix this, I don't know how to see if I might have the same problem of logo on the same row as navigation...
 
Default style with Chrome is the only one that shows a small logo.

From your "Dark" style:

HTML:
<img src="/forums/styles/default/xenforo/PinballNirvana_logoshort.gif" srcset="/forums/styles/default/xenforo/PNlogo5.jpg 2x" alt="Pinball Nirvana" width="" height="">

From your XF default style:

HTML:
<img src="/forums/styles/default/xenforo/PinballNirvana_logoshort.gif" srcset="/forums/styles/default/xenforo/PinballNirvana_logoshort.gif 2x" alt="Pinball Nirvana" width="" height="">

You have to play around with the settings in admin cp -> appearance -> Style properties -> basic options - check this for all your styles.

Here you'll find the logo settings. You should set height ad width and use a logo in exactly that size. The "2x logo URL" (for retina displays) is optional and should have twice the hight and width as the standard logo.
 
Thanks, defining the width and height in the default style worked!

It still seems strange to me that the default with Chrome is the only combination where this mattered. I'll try and research retina display stuff but I noticed the difference in the examples. I'll go through the other styles and add the Public logo width and height of the image.
You should set height ad width and use a logo in exactly that size.

If you specify the width of your logo here, you can avoid a costly re-flow of your page layout once the logo loads.

I don't really understand that XF description but it fixed my problem.:D
 
@nocte has been very helpful lately.
only procrastinating work, that a have to do :LOL:

I don't really understand that description but it fixed my problem.:D
Basically the client / browser does know what space on the site the logo will occupy before the logo is actually loaded if you set a width and height (which is then set in the HTML). Otherwise you will experience "layout-shift" with a slow internet connection on first page load (without the logo in the browser cache). Does that make sense?
 
Yeah it makes sense, I've had XF for over 2 years and am still trying to figure some stuff out, that was a easy fix to a problem that's probably existed since I imported to Xf.

I've only been using Chrome recently for testing some things on the site. I appreciate the help, thought it was settings in my Chrome, and then searched XF, then noticed that every other combination of styles and browsers worked fine.

Thank you!
:D
 
Last edited:
Top Bottom