Store Widget

The Store widget allows you to turn your website into an ecommerce store. You can highlight and manage product or service catalogs, enable a checkout, integrate a payment gateway, track your inventory, manage additional sales channels, and much more. The store also has built-in analytics to monitor website statistics on such aspects as user behavior, orders, and sales.  

Adding the Store widget

Follow these steps:

1. Log into your dashboard;
2. Open the project editor;
3. Press the store icon at the editor’s Left Panel and press Add a Store.

Once you hit the Add a Store button on the Left Panel, a window with the Add a Store button will appear on the screen.

The store page with the Store widget will be created automatically after the click. 

Editing the widget and managing the store

So, you start using the Store widget for your website. It’s time to customize your store and define how it will operate. Choose Store in the dropdown menu to get started.

After you enter the online store, click anywhere on the widget, and you will see a horizontal control panel in the left top corner that contains the following controls: 

1. Widget design (the brush icon);
2. Website page components, navigation, and related content (the Settings button);
3. Digital store management, with analytics, payment, shipping, product catalog settings, etc. (the Store Manager button).

The first two types relate to widget management, while the last one is for digital store management. Let’s figure out what you can do in each of the settings tabs. 

Design

In this control, you can:

• Change an item title and/or subtitle color (some templates allow for adding subtitles);
• Choose buttons’ colors;
• Change price color;
• Modify link color (on the Checkout page);
• Turn on or off borders between page components (i.e., header and main content section);
• Choose the border color;
• Set the border size; 
• Round-off the border by adjusting a corner radius (the Radius parameter);
• Add a shadow around a curved border and customize the shadow by adjusting its blur, distance, color, and angle; 
• Change background color.

Settings

With this control, you can choose which page components, navigation elements, and text to display. Also, you can change their alignment, spacing, and size. 

The Settings control includes four tabs.

• Store configuration. The tab contains a store ID.
• Main. Here you can turn on and off item categories, breadcrumbs, a shopping bag, a footer, a sign-in form, and a tracking tab. These controls are on by default. Also, tooltips will appear when you hover over the parameters.
• Categories. This tab allows for turning off and on a product title, its position (it may appear on hover, can be placed on or below an image), and spacing. The Store widget comes with active title and spacing by default. If you deactivate the title, the widget will hide the position parameter.
• Products. In the Products tab, you can define what product preview images will appear on pages. In particular, you can adjust image size, ratio (between an image’s width and height), align product details (left, right, center), and add borders between products specifying their size and color.

Product page. Use the Product Page to adjust the alignment of details (product description) and additional images — miniature versions of images, a.k.a. thumbnails, to allow users to take a quick look at your items. Settings will appear after clicking on a dropdown menu.

Store Manager

Store Manager is like a command center: you can set up the Store widget to sell products or services. In particular: 

• Check statistics on the number of visitors, orders, abandoned shopping carts, revenue, product views, and other events during a specific period;
• Manage store items, categories, and gift cards;
• Use marketing tools: launch ad campaigns on Google and Facebook, organize email newsletters, create coupons, etc.;
• Manage additional sales channels (social media and marketplaces);
• Adjust store design: item cards, product pages, product gallery view, catalog features, add custom CSS and HTML code; 
• Add payment and shipping methods;
• General settings: Change the store name, add contact information about your store and social media links;
• Create accounts for coworkers to delegate responsibilities.

Boxmode also specifies what next steps you must take to prepare the widget for an online store for non-stop work. 

If you want to get more from the store widget, please check the article about its paid plans and how to upgrade this widget.

The tour over the Store widget, its functionality, and settings is over. If you haven’t created the store yet, why not try to do it now?

Go to Editor