Crave 10 - mobile logo size increase

Hi, I want to increase the size of my mobile logo. I’ve searched the community, and although there’s lots of help, some of the places where they say to inject the code don’t seem to exist in the Crave theme.

Does anyone have a solution? I just want to increase it a little.

Site is https://constabletomsfidgets.com.au/

Password is: skocru

1 Like

Hi @aptay10r ,

I take out the padding inside the container of the logo, the padding can cause sinking in the size.

Try this.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “base.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
a.header__heading-link.link.link--text.focus-inset {
    padding: 0px;
}

Result:

Let me know if not enough.

I hope it help.

Thanks so much for your prompt reply! I added the code and can see the difference. Can we go a little bigger? There’s a lot of space after the logo and before the search icon. Is it possible to increase it a little more? I don’t want it out of balance, but just want a little more punch, you know?

1 Like

Try this.

@media only screen and (max-width: 749px){
.header__heading-logo-wrapper {
    width: 120%;
    padding-right: 20px;
}
h1.header__heading {
    margin-left: -50px;
}
header-drawer {
    margin-left: 0px;
}
}

Result:

Thanks, that looks good now. Can you see?

But when I click on the other pages from the menu, like Products, or About Us, the logo changes back to the smaller version. Is it possible for it to remain the same size across the site?

Appreciate your help.

On my side, looks good on the page that I edit. Cause everytime I refresh it will be gone. :sweat_smile:

Hi @aptay10r

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css

@media only screen and (max-width: 749px){
.header__heading-logo-wrapper {
    width: 110% !important;
}
}

Hope you find my answer helpful!

Best regards,

Richard | PageFly

Hi Richard,

Does that go as an addition to the above answer? If not, then it didn’t change anything.

Alan

I’ve done it, but like I said, the logo is only the size I want on the home page. It’s small on the other pages, like Products and About Us. See attached.

Hi there!

this code will help increase your logo size.

Richard,

It didn’t change it at all. I’m using Ribe_Dagandara’s code but that only works for the homepage. Other pages are small.

Alan

have you used my code, if the problem still exists you can contact the theme to ask them to support this problem.