A Quick Guide on Editing Your BigCommerce Theme

You’re probably here because you’re looking at ways to update or edit the theme on your BigCommerce store. Good news – as one of the most trusted and capable eCommerce platforms for businesses of all sizes, in all industries, there is a lot of help out there. In this article, we’re going to look at some of the ways you can edit your BigCommerce storefront theme.

First, if you’re looking for some information on why it might be a good idea to make an upgrade to your theme, keep these in mind:

• Your theme has a profound impact on user experience.
• Your store theme will impact the integrity of your brand.
• A new theme may help you improve your store design functionality.
• A new theme may give you better access to new or updated BigCommerce features, like faceted search.
• You may be able to improve the responsive design of your website with a theme upgrade.

With that in mind, if you’re just looking for some quick tips on how to make changes, you’re in the right place, so let’s get started.

1. Log into your BigCommerce Portal.

Log into your BigCommerce portal with your login credentials. You should see something in the backend that looks like this:

2. Click on “Storefront.”

Click on “Storefront” as indicated by the red arrow in the picture above. That will take you to a new display and expand a menu on items that you can alter in the backend of your BigCommerce store.

As you can see, the options will expand. Next, you’ll want to click on “My Themes” to proceed, but before you do, note a few things. As indicated by the red boxes to the left of the image above, this is also where you can make changes to other important aspects of your BigCommerce store, such as your blog or scripts. In addition, you can upload themes in this portal, but be aware that if you upload your own theme, BigCommerce will not provide technical assistance.

3. Select “Browse Themes.”

The above image is an inset; here you can see that you can make updates to your current theme as well as customizations. If you want to change your theme, you’ll click on “Browse Themes” as indicated by the red box.

This will take you to BigCommerce, where you will be able to search through a pretty big collection of free and paid themes. You can also sort through collections with respect to how they are optimized and laid out, as well as themes that are popular by industry, as indicated by the red arrows below. Look through their collection and pick the theme that appeals most to you (or you think will appeal most to your customers). Once you select a theme, you’ll be back to editing or customizing it.

4. Alternatively, you can choose “customize update” to  edit or update the theme.

Let’s say you didn’t change your theme but stuck with the theme you had, which in our case is “Cornerstone Light.” You’ll want to click on “Customize Update” which you can see in the middle of the screen of the second image in this post. That will bring you to the image you see below:

There are a few things to note in the image above:

• At the top of the page, you can see toggles for “Design” and “Preview.” In preview mode, you can see how your store will appear once you’ve made and saved changes via the “Save” button at the top right of the image.
• Also at the top of the page, there are previews for how your theme will appear on desktop, tablet, and mobile devices.
• At the far left of the image, in a red box, there are three toggles for “widgets,” “layers,” and “theme styles.” we’ll investigate the basic functionality of these in this post.

5. Edit, Adjust, or Add Widgets.

First, we’ll take a look at how to make quick edits to widgets that you can include or change in your BigCommerce theme. Let’s say you want to add a carousel beneath your menu – BigCommerce’s interface makes the process relatively simple. Simply click on “Carousel” and drag and drop it in the space beneath the menu that says “Drag and Drop Widgets Here.” You’ll then see this image:

Lucky for you, BigCommerce’s interface is straightforward and easy to navigate. Over at the left side of the screen, you’ll see you can make changes to the slides, the background images, the text colors, font sizes links, and more, all without needing to know a line of code.

Now let’s say you’d like to see some variations of the same theme. Over at the left of the screen, you’ll see this:

6. Adjust Additional Features of Your Display. (Styles, Headers and Footers, Homepage and More)

Click on the little palette as indicated by the red arrow and you’ll expand a menu of options, shown in the picture below, including but not limited to “Styles,” “Global,” “Header & Footer” and “Homepage.”

This area lets you make fairly quick and easy changes to the style of your theme. As you can see from two of the options above, these will impact the visual presentation of your theme. For this particular theme, two of the options are “Light” and “Bold,” which are minor variants of one another. From a design perspective, however, they can impact the feeling of your website, its branding, and the overall customer experience.

• As you can also see in the image above, in this area of the theme editor, you can also make relatively quick and easy changes to products, your checkout page, and even payment buttons, all without needing to access or alter any code.
• By this point, you can make many of the high-level changes to your BigCommerce store that come along with changing a theme or altering the visual aspects of your theme, like text, coloring, imagery, or carousels, as well as other qualitative features such as those described immediately above.

However, even though BigCommerce has a user-friendly admin portal that is easy to navigate, even for eCommerce entrepreneurs with little or no design or coding experience, getting the exact visual layout that you envision for your online store may be more time-consuming. In addition, making custom alterations, including those involving code, may require special skills for which you will need the assistance of professional BigCommerce web design or development services.

If you’d like to see something special from your BigCommerce store but aren’t sure how to make the alterations using the suggestions or guidance in this article, get in touch with our BigCommerce developers and designers today. Whether you need a full-scale redesign or would just like to learn more about what we can do for your online business, it all starts with a call to a BigCommerce partner – contact us at 888-982-8269 the next time you need assistance.