...
There are many types of widgets you might work with throughout your site. Each widget type has a pre-designed layout that you can edit within the widget and element settings. We have broken them down into 5 main types:
Fundamental Core Widgets: Basic, Text Overlay, WYSIWYG
Product Widgets: Product, Product Grid, Product Slider, Product Text Overlay, Bridal Ring Styles, Diamond Search Shapes
Custom Gallery Widgets: Custom Gallery Slider, Custom Gallery Grid
Social Widgets: Social Slider, Social Grid, Social Feed, Single Social, Text Overlay Social, Two Column Social
Store Info Widgets: Reviews, Staff, Staff Slider, Logo Scroller, Repair Status, Store Info, Financing Calculator
Click on each type of widget to learn more about them.
Common Widget Settings
The following settings are shared across all widget types. Certain widgets may have extra functionalities that are described in detail on the specific widget pages.
Widget settings are shared across all elements within a widget. For example, if you change the text style in a widget, it will make this adjustment to all textboxes inside, including header and body text. You can edit individual text styles element-by-element.
Type
Select the type of widget you want in this box. You can see what kind of widget is currently selected in the textbox. If you wish to choose a different widget type, simply select “Choose” and make your selection from the available options in the pop-up window.
Style
Text Color - Change the text color of all text within the widget based on your preset colors. You can change these colors at any time by going to Design → Colors within your main sidebar menu.
...
Widget Container Class - Advanced users can specify the CSS class they wish to use on their widget.
Spacing
Control the spacing around your entire widget by adjusting the padding or margin. Use these two options to create space between your widget and the surrounding elements.
...
You can edit both the padding and margins individually for mobile, tablet, and desktop views. Adjust the top, bottom, left, and right side by incrementing numerically. The default interval is 10 pixels.
Textbox Style
Control the style of all textboxes within the widget by applying textbox styles.
...
Text Box Classes - Advanced users can specify the CSS class or they wish to use on their textboxes.
Textbox Spacing
Control the spacing around every textbox in your widget by adjusting the padding or margin. Use these two options to create space between your textboxes and the surrounding elements within this specific widget. (See Spacing, above, for a detailed description of the difference between padding and margins.)
You can edit both the padding and margins individually for mobile, tablet, and desktop views. Adjust the top, bottom, left, and right side by incrementing numerically. The default interval is 10 pixels.
Textbox Alignment
Text Align - Set the text within each textbox to right-align, center-align, or left-align.
...
Textbox Size - Set the textbox size as a percentage of the total column size from 20% to 100% for both height and width. Specify the desired textbox size for mobile, tablet, and desktop views.
Textbox Elements
Use the Textbox Elements to add additional buttons to your widget.
Advanced
Advanced users can use this box to specify custom CSS or Javascript files that will apply on a widget-level.