Home > BigCommerce > Docs > How to change BigCommerce logo size?

How to change BigCommerce logo size?

Last updated: May 01, 2024
This article has been written and researched by our expert Avada through a precise methodology. Learn more about our methodology

Sam

Author

Daniel

Researcher

When you begin your online business in any of the eCommerce platform builders, especially BigCommerce, changing the logo size is one of the basic must-have steps to do.

Modifying the logo size is the first thing that identifies your branding; therefore, in this article, we will show you How to change BigCommerce logo size as you want to replace your store logo with the setup logo BigCommerce.

Let’s dig into it together!

The requirements of BigCommerce logo size

Requirements

Before understanding the process of changing the logo size, you had better know some requirements of it. It helps you to create your logo size that is appropriate to BigCommerce logo standards. If you comply with these standards, you will not experience bad things such as resizing the logo brand or editing it again.

The requirements for a custom image as your logo only:

  • The logo should not exceed 250 x 100 pixels

  • The image file type must be either JPG, GIF, or PNG

  • The image can have a transparent area with alpha set to 0

By following those conditions, you will not have any difficulties with your brand logo, and you only need to focus on modifying your current logo.

How to change BigCommerce logo size

Many brands use imagery as part of their branding recognition. Moreover, they incorporate it into their logo rather than use plain text or their store’s name as the logo. Apparently, BigCommerce allows you to upload your own logo image in order to demonstrate it at the top of all storefront pages.

As a result, it serves not only as branding for your site, but links back to your homepage as well.

There are 2 ways to resize the logo:

1. Resize using Image edit

Step 1: Go to “Storefront” and then choose the “Logo” section to edit

Storefront

Logo

Next, you fill in your store name in the “Text” section.

Text logo

Edit the font color following your favor which goes well with your store’s theme.

You can change the position of the text logo by clicking on “Launch page builder”.

Launch page builder

Or go to “Themes”, then choose “Customize” to edit.

Themes

Customize

These two ways can go to the same page “Page Builder” to customize the homepage like this:

Page Builder

To customize your store template, don’t forget to update from free trial to one of the pricing plans in advance.

Step 3: If you choose “Upload a logo image from your computer”

Then you may drag and drop an image or select an image from the computer.

Upload image

Find the upload options, but we recommend you to choose an image from your computer. You can choose an image and start changing the logo as you want. Here is our picked image as an example:

Upload image

Under the image is the section of logo modification as we can see below. There are logo sizes, max width, max height to edit and you view the modified logo easily.

Choose an image

Choose an image

If you are not satisfied with the change of your logo, you can come back to your settings following the above steps we showed you to fix it.

Notice that the logo image meets all the requirements above.

Step 4: Click on “Logo size”

Since it decides how your logo size actually is on the homepage, you had better edit as you want the logo to be.

The options for you are guided through the image below in detail.

Logo size

After finishing all the stages, remember to save your changes.

Save change

2. Resize using Themes edit

Step 1: Go to “Storefront” and choose “Themes”

Storefront

Themes

Step 2: Choose “Customize”

Customize

Next, click on the “Logo” section. You should notice that “Logo” may be named differently or under another section depending on your theme.

Therefore you had better get used to all the functions in this section.

Customize

Step 3: Click on Logo image size, and select Specify dimensions

Enter the maximum height and width dimensions you would like to use for the logo. Drag down and click Specify Dimensions. Enter the number you want to resize the logo.

Specify Dimensions

Click Save to continue working in Store Design, or “Publish” to make your change viewed on the storefront.

Problems of changing logo size

Obviously, during the process of changing BigCommerce logo size, the retailers underwent some obstacles, happening with their store. With these problems, the BigCommerce support team responds to the customers’ comments depending on each condition of the stores.

The logo is too small to put in, how do I fix it?

It is a common problem occurring frequently to the owners when they first upload their logo image. To solve this, you should read the requirements one more time to check if your image meets all of them.

After reading again and you do not figure out any errors, you need to resize the logo. When the logo is too small, you must enlarge the size more. Our recommendation for logo change is edited from the “Specify Dimension” section.

The dimension should be between 250 - 800 in width and between 100 - 600 in height.

You have changed the logo on a website, but it does not sync with the mobile theme on a mobile view. What should you do?

It is not only a problem but also a concern for retailers because third-party apps play a vital role in the eCommerce industry. They want the theme on the tablet to be in the same flow state as the mobile concept. Thus, the homepage on the phone screen determines how bad or good the shoppers’ impression is at first glance.

When you come to this problem, you have to report this to BigCommerce Center Support. Since this modification relates to CSS coding, it will be better if you have a helper who is expertise in programming to deal with your issue. They, along with you, fix it by reviewing the coding and checking the mobile theme.

Conclusion

We have shown you the detailed steps of How to change BigCommerce logo as well as some concerns that you may crash into when doing it. We hope that you find this helpful article to have the best practice with your store.

About the problems we mentioned above, while setting up your logo branding, if you undergo other issues, please contact us by leaving your comment below. We will try to respond as much as we can do to dissolve it.


Sam Nguyen is the CEO and founder of Avada Commerce, an e-commerce solution provider headquartered in Singapore. He is an expert on the Shopify e-commerce platform for online stores and retail point-of-sale systems. Sam loves talking about e-commerce and he aims to help over a million online businesses grow and thrive.

Stay in the know

Get special offers on the latest news from AVADA.