Download
We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

How to increase logo size? (Persona_free theme)

  • #8772
    Avatar photo[anonymous]

    Hi all.

    I’ve got a new site live at leadnurturing.email and even though I have uploaded (and tested) 2 different logo sizes (250x250px & 500x500px), it’s still showing it massively shrunken down to 69×69. I want it to show up bigger (at least 150x150px) if possible.

    I realise I need to modify the css to change this, but my coding skills in this dept are almost zero.

    Can anyone please help with with a code example to fix this?

    Here’s the code from the main.css if it helps. If it doesn’t, pls let me know what css file you need:

    .header {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(–navbar-height);
    margin-top: 2rem;
    max-width: var(–page-width);
    position: relative;
    }
    @media all and (min-width: 80.0625em) and (min-height: 50em) {
    .header {
    margin-top: 3rem;
    }
    }

    .logo {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    color: var(–dark) !important;
    font-family: var(–font-logo);
    font-weight: var(–font-weight-bold);
    font-size: 2rem;
    line-height: 1;
    margin-right: auto;
    white-space: nowrap;
    }
    @media all and (max-width: 74.9375em) {
    .logo {
    text-align: center;
    }
    }
    .logo > img {
    max-height: 4rem;
    padding: 0.5rem 0;
    width: auto;
    }

    #8773
    Avatar photo[anonymous]

    Try adding this in the Custom CSS

    .logo>img {
        max-height: 7rem;
    }

    Change the “max-height” value to the size that you need.

    #8774
    Avatar photo[anonymous]

    Wow, thanks heaps shaun2k! That worked a treat! 🙂

    Is there something I am supposed to do to ensure this custom css doesn’t get overwritten with future theme upgrades, etc?

    #8775
    Avatar photo[anonymous]

    I don’t think there will be an issue with future theme upgrades.
    The Custom CSS for your site should remain.

    But if you had edited the main.css directly, then the changes will be overwritten.
    So that’s why the Publii creators would advise to use override files

    PS: To preserve your custom code and prevent it being overwritten the next time the theme is updated, please ensure that you have created override files; these are, essentially, copies of the existing theme files that are stored separately from the main theme files → https://getpublii.com/dev/theme-overrides/

    #8776
    Avatar photo[anonymous]

    OK, once again, thanks heaps for your help.