Before you Build: What You Need to Know to Launch a BigCommerce Marketplace Theme

Whether you’re visiting a shop in your hometown or browsing an ecommerce site, first impressions matter. And it’s not just about looks — a professional and beautiful design directly correlates with how visitors feel about a website’s credibility. 46.1% of participants in one Stanford survey mentioned overall appeal and design when evaluating websites for credibility, and in the competitive world of ecommerce, whether or not shoppers feel confident in a business directly affects the bottom line.

At BigCommerce, we designed our second-generation theme engine with this in mind. Under the hood, Stencil is built on modern web technologies like Webpack, Node.js and Handlebars, but it’s also a flexible option for merchants who want to create a beautiful store, without touching code. Today our Stencil theme engine powers all new stores created on BigCommerce and the majority of storefronts on our entire platform.

Stencil is great for merchants who want to pick a beautiful theme off the shelf, but it was also designed for developers, by developers to include features like a CLI tool for local development and familiar frontend technologies. As a developer building for the Theme Marketplace, you can create beautiful designs that help BigCommerce merchants be successful, on a technology stack that’s geared toward developers.

Why Build a BigCommerce Theme?

My role at BigCommerce is Senior Marketplace Manager. In other words, I work with themes and our theme partners a lot. During my time in this role, I’ve had a hand in helping to launch our new Themes Marketplace and making sure developers have what they need to write a successful theme for our merchants.

BigCommerce has been committed to fostering a great partner ecosystem and investing in updates that provide new tools and capabilities for theme authors. If you’ve been watching our changelog, you’ll have seen a landslide of recent releases, many of which are geared towards or work in tandem with Stencil. It’s a great time to team up with BigCommerce to launch a theme in our Theme Marketplace.

If you’re already an agency partner with BigCommerce, writing a theme is a great way to get your name out there with BigCommerce merchants. The Theme Marketplace is embedded within the Control Panel, meaning it’s seen by virtually every merchant on the platform — that’s a lot of eyeballs! Additionally, becoming a Theme Marketplace vendor lends credibility, since merchants know that our themes are vetted by the BigCommerce Marketplace team.

We first launched our Stencil Theme Marketplace with a selection of exclusive themes, but we’re now inviting all partners to become vendors. I’ll walk you through what you need to know to get started and share some of the tips and tricks I’ve learned as a Senior Marketplace Manager to help you find success in the Theme Marketplace.

Getting Started

First, there are a few things you need to know to establish a baseline for theme development. Let’s run through a few of the highlights:

1. Get familiar with Stencil.

Perhaps you’re new to themes on BigCommerce, but you want to get started quickly. That’s great! There are a few technologies you’ll want to be familiar with before you jump in:

• Stencil Command Line Interface (CLI): The CLI will allow you to develop locally while previewing your work against your live production store’s data and settings. Changes that you make to your theme will be immediately viewable through Browsersync.
• Handlebars.js: This is a lightweight templating language that allows you to efficiently embed dynamic and conditional logic onto your storefront pages.
• YAML: With YAML, you can request the objects that you’ll need on the storefront and define only what you’ll need for each template file.
• Store Design: This is the Stencil web-based tool that allows merchants to configure their theme’s look and feel without touching the code. As a developer, you can customize the configuration of the Store Design tool and define the settings that are available to merchants.
• Documentation: And of course, reference our documentation and video series on getting started with Stencil. Both are a great starting point and foundation for your knowledge.

2. Become a BigCommerce Partner.

Before you’re able to submit a theme to BigCommerce, you’ll need to become a Theme Partner. Fill out the Agency Partner application form and select the “Sell Theme in the Theme Store” option.

When you apply, be sure to let us know your level of experience with BigCommerce and Stencil. Include some examples of your previous work with websites or themes, especially any hands-on experience with Stencil. We love to see a great case study — they are the perfect way to show what you’ve done and clever solutions to merchant requests.

3. Do your research.

We have some great themes in our marketplace, but there’s always room to grow and add new experiences for our merchants and their customers. Here’s what you can think about to find the right fit.

Whether a merchant is selling apparel or motorcycle parts, they’re looking for themes that present their products in the best way possible and meet their shopper’s expectations. Designing your theme to serve the needs of a specific vertical is a great strategy. We’re always looking for Marketplace themes that fill gaps in our offerings by targeting a particular vertical, for example, B2B themes or Brand Stories.

Another way to stand out from the crowd is by finding creative solutions that deliver new features. Look for opportunities to deliver value to merchants by providing features that aren’t widely available through existing themes. For example, merchants may want to show color swatches on the category page or treat categories as an order form — this is where you can get creative.

Best Practices for Developing a BigCommerce Theme

Now that you are familiar with the basics of authoring a theme for the BigCommerce Marketplace and you’re ready to dive in — what should you focus on to make sure your theme stands out in the Marketplace? In this section I’ll share my tips and best practices for developing a theme the right way.

1. Start with Cornerstone.

We’ve developed our base theme, Cornerstone, as (you may have guessed) the cornerstone for developers to create custom themes. It’s available from our GitHub repo where you can fork it and begin developing. All of the updates that our Stencil engineering team makes flow out to Cornerstone, so by using Cornerstone as your base, you’ll stay up-to-date with the latest technology improvements.

2. Make it flexible.

Remember when we talked about Store Design? This is where merchants can customize and personalize their stores to fit their specific branding or needs. It’s important to consider how merchants are going to use your theme and what colors, fonts, and styling they may want to change. The more control you can give the merchant over their theme’s look and feel through Store Design, the happier that merchant will be.

3. Build your demo site to impress.

Don’t underestimate the importance of a showstopping demo site. Having a theme in the marketplace and being able to show its features is where you can really shine. A good demo store should be aspirational — you want merchants to visualize your theme on their store and like what they see. It’s like getting to see that new car in the showroom, so show it off!

Here are the best practices to follow when creating a demo site:

• Create a cohesive experience with your demo site. Make it feel like a real store with examples of all types of produces (single product, product with options, etc)
• Showcase the unique functionality of your theme. You’ve put in the effort to write a great theme, let merchants know what they can expect.
• Use Store Design features to your advantage and give your demo site a next level look without having to hardcode.
• Merchandise like a pro! Since you’ve got a vertical in mind, show merchants how it can work for their products, too.

Submitting your BigCommerce Theme

Now that you’ve wrapped up your development and testing and been approved as a theme partner, here’s the process for submitting your theme to the marketplace:

1. Reach out to the Theme Marketplace team at themestore@BigCommerce.com and let us know that you’re ready to submit your theme.
2. We’ll send our Creative Brief form for you to complete with information about your theme (theme name, wireframes, targeted vertical, etc).
3. BigCommerce will work with you to figure out how best to position your theme in the Theme Marketplace.
4. We’ll set you up with a repository where we can collaborate on your submission.
5. Get ready for publishing your BigCommerce theme.

Conclusion

Developing a theme for the BigCommerce Theme Marketplace is a great way to reach a wide circle of merchants using the platform and build your reputation as a solid and skillful agency. And by working with Theme Partners, BigCommerce can continue to meet the needs of merchants big and small who are looking for a professional and beautiful store design.

We’ve talked through some of the technology you’ll want to familiarize yourself with, as well as some tips to make your theme stand out from the competition. When you’re ready to take the next step and apply to be a vendor in the Theme Marketplace, my team and I will be there as your partner in the process. If you have questions about partnering with the BigCommerce Theme Marketplace, email themestore@bigcommerce.com or connect with us on Twitter @BigCommerceDevs.