BLOG

Stencil - New Theming Engine For The Bigcommerce Platform

Stencil

Stencil - New Theming Engine For The Bigcommerce Platform

The demand for online retail often brings in a challenge to pace ahead with the E-Commerce trends. We all might have enhanced our skills to present the best development solutions and customize web design.

According to our experience, the design of a website is related to the revenue generation. The design influences the visitor to go through the online store, eventually converting the leads into sales. So, with this as the scenario, you can catch a glimpse of the new Stencil design framework. As the developers have worked hard towards offering the best solution, here’s what Stencil would offer.

Stencil Toolkit & Framework

The toolkit helps developers to change the themes locally and come up with a stunning web design. This means that the changes can be previewed without impacting the live storefront. The look and feel of the site can be achieved with all the required assets.

Theme Marketplaces

With Stencil, it’s now easy to distribute themes to online merchants. It was way back in the year 2017, when the BigCommerce marketplace started distributing the partners’ Stencil themes. This offered ample time to think as well as build a business model. Every approach revolved around the Stencil creation and conversion.

Theme Editor

If the merchant is still struggling to change the look and feel of the online store, then he should rely on Stencil. Customizing a theme through the graphical, browser-based tool is very much easy. The retailer doesn’t have to hire a programmer or delegate the task to someone else. Moreover, the theme developers’ configuration choices give an idea of which aspects need to be customized. The choices can also be determined if someone needs to make the website look different.

Storefront Customization

As the merchants acquire themes, these can be applied to the online store and customized accordingly. They would be happy to create a mesmerizing user experience that complements the brand. It then becomes simpler to find the products and make a purchase at the next instance.

Benefits of Using Stencil

Web pages of Stencil take less time to load on the internet. An improvement in the loading time implies better rankings and more lead conversions. Studies have revealed that if you want customers to add the item and make a purchase, then every millisecond counts. Kissmetrics also drew a conclusion that the conversion may drop slightly if there’s 1 second delay in the loading time. This means if you are gaining profit from the online store as much as 10,000 dollars, then one second delay can lead you to bear the cost equivalent to 250,000 dollars every year.

Stencil is a smarter framework even if the individual doesn’t know about the technical things. As the actual code is better, customization can be achieved easily and more efficiently. For instance, as compared to Blueprint, the size of the CSS and Javascript files is reduced and the basic HTML code is cut down and written in an efficient way. Since the developers don’t have to go through lengthy codes, they would be delighted in working within the framework. This keeps the code organized and improves the overall performance of the website.

Stencil would surely improve the search engine rank for websites. While the pages load in less time and the text-to-code ratio drops down, the framework affects the SEO rank. In fact, Stencil is optimized to boost SEO and increases the chances of showing up the website on the first page of the Google search results. In addition, by being compliant with AMP, Stencil beats Blueprint with respect to the ranking.

If you haven’t heard about AMP, then it’s nothing but an open source Google framework to enable sites load faster. If your site boasts AMP pages, then it would be exclusively shown on Google. This would garner the attention of visitors and increase the click through rate. The feature along with Stencil’s overall efficiency can complement the SEO techniques.

An Adaptable Platform

Many platforms need to be certified and eventually rely on the agency for changes. But, the case with Stencil is much different because companies can take risks. They no longer need to rely on an agency to implement the changes and evolve the site as the business starts developing.

Reduces Iterations

Website design on the SaaS platforms can be rigid and may not offer the flexibility. But, with the next generation, Stencil offers the capabilities and an array of options for customization. The developer doesn’t have to create 25 different templates to do 25 different things. The ‘handlebars’ language can just help to use a logical approach at every step. You can now work on 1 template and manage doing different things.

How to Start Off with Stencil?

Moving ahead with the new environment can certainly help to adopt the conventions.

Initially, you need to choose a development path and select the level of customization. Once you have sourced a development partner, you would seek assistance for theme development. You can also refer to support guide to check out how you can work with a design partner.

Now, with light customization, you can use the Graphical Theme editor and think about a stunning storefront. Apart from customizing the layout attributes, you can change the theme’s color, banners, headings, carousel and more. You can also decide on the list of products on the web page, the brand pages and the category pages.

If you’re familiar with HTML and CSS, then you can directly edit the theme files through the Stencil’s Edit Theme file feature. To refresh your knowledge about tags, you can always surf the internet and go through online courses.

For gaining control over the theme’s appearance, you would have to use the Stencil CLI’s framework. To know the conventions, you can go through the videos posted on the site of BigCommerce.

For a quick start, it’s feasible to change the layout details and alter the page design. The front matter section allows you to present a list of products with just a few keystrokes. But, before moving ahead, you should know the YAML syntax.

With the handlebars template language, it’s simple to assemble dynamically changing content. You are present the online store after fetching data from various sources and BigCommerce store's catalog.

As for the syntax, you can execute powerful Javascript operations with less Javascript code.

Finally, with the launch of 20 websites till date, Stencil is sure to transform the E-Commerce technology landscape. People can focus on development once they gather insights. It would soon be nicknamed as ‘the leading design framework for online stores’.

Get a Free Quote

Let's discuss your business requirements to make it from nothing to everything!