(00:02)
Hey there! Are you still on the Blueprint framework on BigCommerce and thinking about moving over to Stencil? Maybe BigCommerce keeps telling you to migrate, or you’re just wondering, “What is this Stencil that everyone keeps mentioning?”
In this video, we’re going to talk about migrating from Blueprint to Stencil.
Before we get started, my name is Cal. I’m a developer, store owner, and I run the eCommerce Growth private group for stores like yours and mine. It’s completely free to join—I’ll leave a link under the video. Be sure to check it out! Every week, I post more eCommerce videos, so if you find this one useful, subscribe and hit the bell to get notified when I post more.
(00:29)
Alright, let’s talk about BigCommerce Blueprint. Before Blueprint, BigCommerce had a framework we used to call Three Column Blue, which was the theme that everyone started with. It was hideous—three columns and just terrible!
Then they introduced Blueprint, which was a huge improvement. But in 2016, they announced that they were moving away from Blueprint to this new thing called Stencil. Everyone was like, “What is Stencil?”
(01:00)
Let me clue you in: Stencil is a combination of Handlebars.js and Stencil CLI. People in the BigCommerce community just refer to it as Stencil as a whole, but it’s really these two components working together.
Stencil CLI is a massive tool for developers like me because it allows us to develop locally on our computers and push updates to your site once everything is ready. This way, we can test things in a local environment, make changes, and only go live once everything is good to go.
Before this, we used to do a lot of on-the-fly editing, which sometimes got messy. So, Stencil CLI was a major leap forward, giving us a much better development process.
(01:29)
Now, Handlebars.js is a JavaScript library that lets us use template tags—those little curly brackets you might see—calling data from your database, like product titles on a product page. We had something similar on Blueprint, but with Handlebars.js, we can do much more.
For example, we can loop through all your custom fields on a product page or display all product cards on a category page. We can also do cool things like if
statements, allowing us to say, “If this product has a certain custom field, show this specific information.” This gives us a lot more power and flexibility.
(02:32)
This is why everyone encourages you to upgrade to Stencil—it’s just so much more powerful than Blueprint. But you’re probably wondering, “What does it take to actually upgrade from Blueprint to Stencil?”
The big difference is how the template is written. The database tags used in Blueprint are not compatible with Stencil, and vice versa. These are two completely different systems, so if you want to go from Blueprint to Stencil and you like your current design, you’ll need a developer to code a new Stencil theme that mimics your old design.
(03:12)
If you’re not attached to your current design, you can check out the BigCommerce Theme Marketplace and pick a new Stencil theme. This option lets you upgrade without a big development cost.
However, keep in mind that when you activate the new theme, it will go live immediately on your site. This means you’ll need to get everything into shape quickly—otherwise, your store could look like a mess. So, if you go this route, I recommend being prepared for downtime and using maintenance mode to avoid confusing customers while you’re getting things ready.
(04:28)
Also, it’s a good idea to have a developer on standby to help you clean up any issues quickly. But if you’ve been around since before 2016, maybe this is a great opportunity to do something more custom. Instead of just doing a lateral move from Blueprint to Stencil, why not take this chance to improve your store design?
You could engage with someone like my team at Epic Design Labs to recode your site or give it a design refresh while migrating to Stencil. Yes, it’ll cost more upfront, but in the long run, you’ll likely end up with a much better store that’s optimized for growth.
(05:32)
The benefit of working with a developer like us is that we can develop and test the new site before it goes live. This way, you avoid the potential mess of launching a marketplace theme and trying to fix it on the go. It’s a more upgrade-friendly path overall.
But regardless of which option you choose, you’ll need to switch from your current template and recode your site for Stencil. And if you have any custom scripts from your old site, there’s a good chance they’ll need to be rewritten.
(06:41)
One important thing to note: Once you move away from Blueprint, you can’t go back. BigCommerce won’t allow you to switch back to a Blueprint theme after you’ve migrated, so this is a one-way change.
That’s why it’s crucial to plan ahead and make sure everything is ready before you flip the switch.
(07:16)
In the end, migrating from Blueprint to Stencil is an opportunity to clean up your code, improve your store design, and future-proof your site. Yes, it will cost some money if you do it the right way, but Stencil is faster, more flexible, and supports newer apps that aren’t compatible with Blueprint.
(07:49)
If you’re still on Blueprint in 2021 or 2022, it’s definitely time to make the switch. If you need a developer to help with the migration or anything else, feel free to reach out to us at Epic Design Labs.
I hope this video gave you a better understanding of what the upgrade process looks like. Be sure to join the community at jointecommercegrowth.com, and if you found this helpful, hit the like button!
I’m always looking for ways to help you guys out, so leave a comment below with anything you’re stuck on, and that might be my next video. Thanks so much for watching, and I’ll see you next time!”