How to Use BigCommerce Page Builder to create and edit pages?

BigCommerce is currently one of the best platforms for eCommerce businesses. It offers users uncountable special features and tools for evaluating their online selling experiences. And you can not miss out BigCommerce Page Builder!

Your knowledge of developing websites and coding is zero? So if you want to customize your online store’s theme to fit your business, you will have to hire a web designer and developer? The answer is No. You can totally make use of Page Builder - a brand new tool established by BigCommerce.

This paper will inform you about the functionality of BigCommerce Page Builder, its benefits, and how you can apply it to personalize your front page.

The definition of BigCommerce Page Builder

BigCommerce Page Builder is a tool designed for online merchants to adjust their website’s front-end by dragging and dropping texts, images, videos, carousels, lists of products, or even banners at any preferred position. It is especially useful for redesigning your storefront so that it matches well with your brand.

There are a plethora of advancements in this latest tool. Not only does it help you to get your store ready in a shorter amount of time but you can also connect and draw your customers’ attractions by trending contents because it can be quickly modified at any point.

Besides, BigCommerce users will also be provided with the access to editing the theme’s template. This means that they can easily customize the template files or even revert their store back to the default theme if it is necessary to do so.

Pros of BigCommerce Page Builder

BigCommerce Page Builder comes with many merits:

1. Saving time for getting started and running

BigCommerce Page Builder will provide users the ability to make use of a solution called drag-and-drop. There is no need to code or do any complicated steps to make your website look exactly like your expectations. Now, you can spend your precious time focusing on marketing and managing your products, and building customer relationships.

With this feature, even someone who has never used technology can create personalized and stunning online platforms to display their products and attract more consumers.

2. Adjust your brands based on your preference

Templates for BigCommerce themes might not always satisfy your needs and represent the soul of your brand. However, with the help of Page Builders, you are the boss!

You can change every little detail based on the available theme or just create one on your own from the homepage, the appearance of your products, categories, banners, and image slides. Even if you want to change your online store’s atmosphere, within a few clicks, your website is now wearing a brand new suit.

3. Easy updates with API widgets

Mentioning BigCommerce Page Builder, we can not skip its skillful widgets, which we will introduce to you later in the article. With API widgets, developers will expand on what is feasible and create tailored apps to enhance shopping experiences.

HTML, CSS, Javascript, and so on - everything will be covered when you use page builders. Online store owners will have full access to their website without knowing anything related to coding.

4. Preview before making decisions

BigCommerce wants to make sure that its users can ever serve their customers with the best products and services. Therefore, BigCommerce Page Builder has been developed to ensure that every online merchant can check out their storefronts before releasing their brands.

Testing out how your content and pages will be viewed on different technology gadgets before the publication will help you control and acknowledge possible mistakes and then figure out suitable solutions.

How to use BigCommerce Page Builder to create a new page?

If you are new to this spectacular tool, don’t worry too much. We are here to help. There are a few steps so that you can successfully set up a BigCommerce Page Builder. Doing the same as the following guide will save you a huge amount of time!

No more beating around the bush, let’s get started:

First of all, please enter your BigCommerce store then choose Home > Storefront

Here, you will see a list of related tools for your website’s frontpage, click on the first line called My Themes

Click on Customize to start dragging and dropping features using BigCommerce Page Builder. This is how your screen will look like:

You can see that you can customize a list of features based on your preferences on the left side of your screens, such as layout, text, image, or the hero banner. Don’t forget to check out every button to see how it functions!

At the top of your website’s front page, there are icons for different devices that you will change your website into. There will be a computer version; then the tablet’s one and the last one for mobile phones. Thanks to this, you can have a full view of how your website will vary on diverse screen sizes.

Next to the Devices icon, you will see a Design-Preview button; this is where you can check how the style improvements appear on a particular website, much as you might see it on the storefront.

If you have finished navigating your website, you click on the “Save” button on the top right corner.

Or if you want to cancel previous changes, choose the button next to it - Discard.

On top of the column with adjustable features, there is a box appeared in case you want to create a new page:

Tutorial to make changes for your BigCommerce page using Page Builder

These will be more detailed steps to customize your BigCommerce’s storefront with Page Builder features.

1. Themes

The Theme Style adjustment is displayed as the last icon in the left column when you open the BigCommerce Page Builder. Many design elements can be customizable right here, from color, fonts, font size to the logo, footer, header, and navigation. Other interface features may also be disabled.

Smaller components are organized in bigger groups on the basis of where it is located or what sort of element they are (buttons or icons). The current parts and their titles can be distinctive because they have different themes.

Other incredible features you can hardly exclude are:

• The Theme Styles’s windows are portable: You can put it anywhere on your screen as long as it gives you just enough space to visualize your whole website.
• Editable files of themes: If you use any templates provided by BigCommerce for your online store, you can effortlessly update it with the files. But this is not advisable as almost every BigCommerce theme has been already well-organized.
• The availability of original themes: with theme styles in page builder, BigCommerce users can restore the website’s theme’s initial version whenever they like.

2. Layers

Above the Theme Styles icon, the Layers tool lets you see the current widgets’ arrangement, which you have added to your site. The names of all accessible widget regions will be mentioned.

• If any region has been expanded, any layouts in this area would be available for you.
• At any expanded layouts, the columns will appear.
• If you are expanding the columns, then every widget set in that column will also be seen.

When you click on the icon, this is what you would come across:

It allows layouts and widgets to be dragged and dropped for changing purposes. If you click on a particular layout, columns, or widgets, the associated settings will appear on the right side of your screen.

3. Widgets

I have mentioned the word “widgets” multiple times in previous sections, but what are they, and how do they look like? We will respectively clear your mind about this matter.

Widgets are used to build your website from every corner specifically. It is divided into layout, text, image, hero banner, carousel, video, and even product widget and the list goes on. Initially, we will guide you on how to add them to your BigCommerce Page Builder.

You can add widgets to any page of your website like homepage, categories, brand pages, web pages, blog entries and even the customer’s cart pages. When you are at the Page Builder, you will see smaller widgets on the left side, all you have to do is click on the one you want and then drag it into the preset regions.

As you can see from this image, we have dragged a hero banner into the section that we want to. After that, all the settings related to this will also appear on the left side of your website. You can adjust it, just the way you like!

If you want more, you can start stacking your widgets by adding new ones under the available ones just like what we did:

Conclusion

BigCommerce Page Builder can be very helpful if you want to make changes to your website and know nothing about web development. With this specific tool, you now no longer have to depend on developers and designers, plus it is even time-saving. Why would you miss such a good chance?

We hope that this article will give you uesful information about Page Builder, understand how it works and make good use of it. We are waiting for your results!