Invision Community 4: SEO, prepare for v5 and dormant account notifications Matt November 11, 2024Nov 11
Posted July 15, 20204 yr after upgrading i notice issue in the logo size in my website so i go to the themes setting and Logo and i try to change the Logo Height but give me some messages Quote The value must be smaller than 100. any idea ?
July 15, 20204 yr That is a percentage field so it only goes up to 100. It wants to know the height of the logo image relative to the header bar, in percent.
July 15, 20204 yr You can adjust the height using pixels by editing the CSS variable instead if that works better for you.
July 18, 20204 yr On 7/15/2020 at 10:25 AM, bfarber said: You can adjust the height using pixels by editing the CSS variable instead if that works better for you. @bfarber Where can I find the CSS to change logo height? I liked he pre-beta8 settings way better...
July 18, 20204 yr Use the below in your custom.css file - you can change the height element to either pixels or percentage whichever suits you best and you can change the width too if necessary. .sMainHead__logo { max-width: 230px; height: 150%; } If you're using a custom theme, then the above may be a different element. 🙂
July 18, 20204 yr Are you using a theme other than stock? Can you provide a link to your site and then I can check to see what element needs to be changed?
July 18, 20204 yr OK add this to your custom.css file: #elSiteTitle, #elLogo { margin-top: 10px; margin-bottom: 10px; height: 150px !important; } Change the height to whatever your logo height is, or a percentage thereof in pixels (don't use percentage sign %). The margins can also be adjusted to suit - just gives the logo a little breathing room. Edited July 18, 20204 yr by Davyc
July 18, 20204 yr That worked! Wonder what changed? My default light theme works fine with the larger logo??
July 18, 20204 yr Different themes may have different element names - finding the correct CSS to change will depend on what changes the theme developer has made; therefore, some CSS changes won't work globally for all themes. Finding the correct element is usually done using the browser console, make the changes in the console and see if the changes you expect actually happen 🙂
July 18, 20204 yr Yes, that is what is weird though...my light and dark theme are both default however, I created the dark theme around beta 8 so it is probably different than the beta 1 light theme. Thanks for the help @Davyc
July 20, 20204 yr You should be able to change the height by adding something like this to your custom.css :root { --logo--height: 100px; } by default it's a percentage based on the AdminCP theme setting, but you can override it with a hardcoded pixel height.
September 9, 20204 yr On 7/20/2020 at 10:47 PM, bfarber said: You should be able to change the height by adding something like this to your custom.css :root { --logo--height: 100px; } by default it's a percentage based on the AdminCP theme setting, but you can override it with a hardcoded pixel height. This made the logo bigger but it went pass through the whole navigation menu.