Website Building » Shopify » How Do I Resize My Logo in Shopify?

How Do I Resize My Logo in Shopify?

Last updated on January 7, 2023 @ 5:20 pm

When you first set up your Shopify store, you’ll need to upload a logo. The logo file you upload will be used on your store’s frontend and in the order confirmation emails that your customers receive.

If you need to resize your logo, there are a few things you can do.

If your logo is too large:

1. Go to Settings > Files and click the Edit link next to your logo file.
2. On the Edit File page, click the Resize link.
3. Enter the new width and height for your logo in the Width and Height fields. The changes will be saved automatically.
4. If your logo is still too large, go back to Settings > Files and repeat steps 1-3 until it’s the right size.

If your logo is too small:

1. Go to Settings > Theme > Edit code.
2. In the Assets folder, click on the theme.liquid file.
3. Find the code that calls for your logo file and add a class attribute to it.
4. In the Stylesheet folder, click on the theme.scss file (or theme-xxxxxx-xx-xx-xx-x-x-x if you’re using a child theme).

  • If you don’t see a .scss file, look for a .css file instead (or a stylesheet with a similar name).
  • If you’re using a third-party theme, check its documentation to see where its stylesheet is located
  • If you can’t find it, ask the theme developer for help.
  • Or, if you’re comfortable working with code, try doing a search for “logo” in all of the theme’s files to see where it’s being called from so you can add the class attribute there instead (just be careful not to break anything!).

5. Add the following CSS code to your stylesheet: .logo { max-width: 100%; }
6. Save your changes and check your site to see if the logo looks better now! If not, try playing around with the max-width value until it looks right. For example, you could try 75% or 50%.

PRO TIP: If you are not careful when resizing your logo in Shopify, you could end up with a distorted or unprofessional looking image. Make sure to use an image editing program that allows you to preview the changes you are making before you save them.

That’s all there is to it! Resizing your logo in Shopify is easy once you know how. Just remember – if your logo is too large, go to Settings > Files and resize it there; if it’s too small, add a class attribute to the code that calls for it in your theme’s stylesheet and then use CSS to set a maximum width for that class .

Kathy McFarland

Kathy McFarland

Devops woman in trade, tech explorer and problem navigator.