Welcome to Epic Page Builder Widgets

Welcome to Epic Page Builder Widgets

If you’re running an ecommerce store on BigCommerce, streamlining your page design without the constant need for developers is crucial. That’s where the Epic Page Builder Widgets plugin comes into play. In this video, Kal, the CEO of Epic Design Labs, walks you through the app and demonstrates how to maximize its features for building out stunning pages on BigCommerce with ease.

Whether you’re looking to fine-tune your storefront’s appearance or simplify the layout, the Epic Page Builder Widgets offer powerful tools to enhance your site’s functionality without needing advanced technical skills. Watch the video below to learn how to set up these widgets, install them, and start customizing your store with just a few clicks.

What You’ll Learn from the Video

Kal dives into the Epic Page Builder Widgets plugin, offering practical insights and live examples on how to effectively use it within BigCommerce’s Page Builder. Here are the key takeaways from the video, with timestamps to help you find the exact moments that matter:

  1. Introduction to Epic Page Builder Widgets (00:01)
    Kal gives an overview of the app and explains how to navigate the backend of your BigCommerce store to access the widgets plugin.
  2. Installing Widgets and Managing Premium Features (00:53)
    Learn how to toggle individual widgets or install all the free widgets at once. Kal also highlights how to unlock premium widgets like the highly-requested Accordion Widget.
  3. Using Custom Widgets in BigCommerce Page Builder (02:23)
    Kal demonstrates how to use widgets in the Page Builder interface. He covers the basics of custom widgets like the Heading Widget and Alternating Banner, making it easy to adjust text, images, and layouts.
  4. Managing List-based Widgets (06:09)
    Get insights into managing list-based widgets like the Image Gallery. Kal explains how to edit images and titles and use advanced settings to control how items display across devices.
  5. Styling and Adjusting Layouts (10:53)
    Kal walks through styling widgets, adjusting layouts, and using the Page Builder’s Layers feature to move and style elements, helping you create visually appealing and functional pages.

Watch the Full Video for More

This video is packed with actionable tips and practical steps to help you get the most out of the Epic Page Builder Widgets plugin for BigCommerce. By following along, you can create a beautiful, customized storefront without needing to rely on developers for every update.

If you want to enhance your BigCommerce site and build dynamic pages with ease, click play and start mastering the Epic Page Builder Widgets today!

Full Transcript

(00:01)
Hello, my name’s Kel. Thanks for checking out the Epic Page Builder Widgets plugin, the app for BigCommerce. First of all, welcome to the app! I’m here to show you around, help you get started, answer questions, and make it easier for you to use the plugin.
(00:28)
When you load the app, it will appear under the Apps subfolder in the backend of your BigCommerce store, under Epic Page Builder Widgets. The screen will look like this:
Links at the top for FAQs, Documentation, and Support.
Tabs: You’ll start on the Configuration page, and there’s also a Billing page where you can upgrade to premium widgets.
If you have ideas for custom widgets, click the Custom Widgets button to send us a note.
(00:53)
On the Configuration tab, you’ll see a list of all available widgets, which are growing all the time. You can turn them on individually by toggling each one, or you can use the Install All toggle to install all the free widgets at once. Once you upgrade, you’ll also have the option to install premium widgets, including the highly-requested Accordion Widget.
(01:54)
The Accordion Widget is a must-have. Once you install all the widgets, head to Storefront > My Themes and click Customize. This will take you into BigCommerce’s Page Builder, where you can access and use the widgets.

Using the Page Builder
(02:23)
The Page Builder looks like this. You’ll see a section for the basic BigCommerce widgets, which are good but may lack some controls. Our custom widgets improve on these.
(03:29)
Example:
Heading Widget: Drag and drop it to add a heading. You can change the text and set it to H1, H2, etc., for better SEO. It pulls your theme’s default styling but can be customized further.
(04:31)
Another cool widget is the Alternating Banner Widget. You can create rows of alternating banners quickly. Use the settings to align images and duplicate them for easy customization.

Working with List-based Widgets
(06:09)
Some widgets, like the Image Gallery Widget, are list-based, meaning you can manage multiple list items. For example, you can change images or titles by clicking on each item. Additionally, use the settings (the three dots in the top right) to control things like how many images to display on different devices (tablet, desktop, etc.).

Advanced Widgets
(07:52)
Let’s look at the Hero Masthead Widget. This allows you to create a stunning hero section without a slideshow. You can easily customize the text and background image.
(08:27)
Now, the Accordion Widget:
By default, it creates three tabs (Tab 1, Tab 2, Tab 3), which you can customize.
You can add more accordion blades with the plus button.
If you don’t want the accordion to span the entire width, use BigCommerce’s Layout Widget to control its size and positioning.
(09:41)
You can also combine layout widgets to create multi-column designs. For example, use a three-column layout with a wider center column and place your accordion widget in the middle.

Styling Widgets
(10:53)
If you need to move a widget within a column or layout, use the Layers option in the Page Builder. This helps you hover over and select specific elements, so you can move or adjust them easily.
(12:00)
You can also add backgrounds, borders, or other styles to rows and columns using the layout tools. For example, add a background to a column or adjust the border for better design aesthetics.

Bonus Features
(12:37)
There are many additional widgets, like a Tab System, Sliders, and a Custom Menu Widget. The Custom Menu Widget is great for creating a sidebar or navigation menu. You can link to different pages, set the menu to be horizontal or vertical, and even control where links open.
(13:58)
You can also use this widget to create footer regions or sidebar menus for your store pages, allowing for a fully customized navigation experience.

Final Thoughts
(15:02)
There are endless possibilities with these widgets. The goal is to give you the tools to build your store without needing a developer for every small change. If you have ideas for new custom widgets, or feedback on the plugin, we’d love to hear from you. Thanks for using the Epic Page Builder Widgets plugin!