How to increase the size of Logo on Homepage

My Shopify theme won’t let me increase the size of the Logo on my homepage header through the Theme Customization Menu. Please provide me another way to increase the size of the logo.

Theme: Origin

URL: billon.maison

2 Likes

Hey @MaisonBillonDon

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag


RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

Hi @MaisonBillonDon , thanks for reaching out.

To address the issue, please help me go to your Theme => Online store => Customize => Theme settings => Custom CSS and insert the following custom code:

img.header__heading-logo.motion-reduce {
    width: 250px !important;
}

You can take a look at the expected result here:

I hope my solution is helpful to you, and please feel free to feedback.

Esther

Hello @MaisonBillonDon
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.

.header__heading-logo {
height: revert-layer !important;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

Hi @MaisonBillonDon

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If you find my advice helpful please remember to LIKE and accept as SOLUTION.
Thanks!

Hi @MaisonBillonDon

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.css / based.css file and paste the code in the bottom of the file.
.header__heading-logo-wrapper img {
    width: 230px !important;
}
header.header h1.header__heading {
    padding-left: 0px !important;
}
screen and (max-width: 749px) {
h1.header__heading {
         margin-left: 0px !important; 
}

Result:

If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!
Use our Big Bulk Discount app to boost your sales! :rocket: (https://apps.shopify.com/big-bulk-discount). Easy to set up and perfect for attracting more customers with bulk discounts. Try it now and watch your revenue grow!

Hi @MaisonBillonDon

Please add this code to Custom CSS in Online Store > Themes > Customize > Theme settings to increase logo size on homepage only.

.header__heading .header__heading-logo {
width: 250px;
}

Hi @MaisonBillonDon

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
@media screen and (min-width: 769px){
.header__heading-logo-wrapper img {
    width: 300px !important;
}
}

Here is the result:

I hope this helps

Best,

Daisy

This worked, Thank You !! :grin: