Browse by Topic

Store Logo

Using an Image Logo

Many brands use imagery as part of their branding and incorporate it into their logo. By default, the store uses plain text and your store's name as the logo. BigCommerce allows you to upload your own logo image to display on the top on all pages of the store. It serves not only as branding for your site, but links back to your homepage.

 
 

Logo Image Limitations

  • The logo should not exceed 250 x 100 pixels.
  • The image filetype must be JPG, GIF, or PNG. Animated GIFs will not animate on the storefront.
  • The image can have a transparent area or areas with alpha set to 0.  
 
 

Uploading an Image Logo

Before uploading an image to use as a logo, consider the requirements listed above.

1. Go to Storefront › Logo and select Upload a logo image to use as your logo.

Upload a logo image

2. Click Select an image from your computer or drag an image into the box.

Select Image

3. Once the image is uploaded, there will be a drop-down menu where you can adjust how the image is sized. Click Save to finish.

Resize Drop-down menu

 
 

Resizing Logo

This guide provides steps you can take to resize your logo image if it is too large for your BigCommerce store's theme.

Example of an oversized logo on a BigCommerce 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.

This only applies to some Stencil Themes. The option to control the logo size may not be available in all theme editors.

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

Customize Button

2. Find and click the section for Logo. It may be named differently or under another section depending on your theme. 

Logo Optimized Option

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

Specify Logo Dimensions

 

Logo look distorted? The Specify Dimensions option does not maintain the 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 with an Image Editor

Using your preferred image editing software 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.

 
 

FAQ

Will the logo work on mobile themes? 

For responsive themes like Stencil, there are no extra steps to make the logo appear on mobile versions of the site. If you are using the legacy Blueprint mobile theme, you will need to upload a logo for it if you want to display an image logo on mobile. See Using the BigCommerce Mobile Theme (Blueprint) for more details.

Was this article helpful?