Browse by Topic

Resizing Your Logo

This guide provides steps you can take to resize your logo image if it is too large for your BigCommerce store's theme. The steps vary on whether you have a Stencil theme or one of the legacy Blueprint themes.

See Which Theme Platform do I have? to determine which steps will apply to your store. 

Example of an oversized logo on a BigCommerce theme.

Automatic Resizing

Follow these steps to have your logo automatically resized when uploading it to your theme.

1. Go to Storefront Design › Design Options, then click the Logo tab.

2. Select Upload a logo image from my computer.

Upload a logo image from my computer

3. Scroll down to the Logo Upload section, then click Choose File.

Choose File button

The recommended logo size for your theme can be found in your Theme's Manual for purchased themes. If you don't see your theme listed, for most themes we recommend a logo size of 250 x 100px.

4. Select your logo image file from your computer. Accepted file formats are .jpg, .png, and .gif.

5. Check Resize Logo, located below the Choose File button. 

Resize Logo checked in Logo Upload settings

 

Don't see this option? The Resize Logo option is only available for our Legacy Blueprint themes. Stencil themes automatically resize logo images to an optimized size. See the sections below for more instructions.

6. Click Upload Logo Image.

Example of logo image that has been auto resized to fit a theme.

Resizing with Theme Editor

Stencil themes automatically adjust image logos to a size pre-determined by the theme's code. To adjust this preset size, you will need to adjust it in the Theme Editor. These steps only apply to Stencil themes.

1. Go to Storefront Design › My Themes and click Customize on your active theme.

Customize Button

2. Click the section for Logo.

Logo Optimized Option

3. From the drop down, select Specify Dimensions. Enter the dimensions you want to resize the logo to.

Specify Logo Dimensions

 

Logo look distorted? The Specify Dimensions option does not maintain Aspect Ratio. The dimensions you enter should match the aspect ratio of your logo image.

3. Click Save Changes to continue working in Theme Editor or Apply Theme to make the changes live on the storefront.

Resizing via Image Editor

Using your preferred image editor you can manually change the image size to fit more appropriately on your storefront. You can use an online editor like Pixlr or an image editing program installed on your machine.

Once the logo image is resized, follow the instructions from Using a Logo Image. To learn more about adjusting images, see Fixing Distorted Images.

Was this article helpful?