Support

Widgets: Library and Overview

Widgets are the key building blocks of a site, allowing you to add and manage content effectively. They serve as essential elements that enhance both the functionality and design of your website. By incorporating various types of widgets, you can create a dynamic and engaging user experience.

Add Widgets

To add widgets from the widget library:

  1. In the side panel, click Widgets to open the widget library.
  2. Widgets can be searched for using the search bar at the top or by scrolling through the different sections in the library.
  3. See Video #1:
  4. Click and drag the widget to the location you want in the site. A blue placement indicator appears.
  5. The widget appears in the location shown by the blue placement indicator.


When dragging-and-dropping a widget to your site, note the text in the blue placement indicator (Classic editor only):

  • Insert here. The widget will be added to an existing row or column.
  • Insert in new row. A new row will be added and the widget will be placed inside of it.
  • Insert in new column. A new column will be added and the widget will be placed inside of it.


See Tips on Widget: Video #2


Edit Widgets

Widgets are the building blocks of your site. You can customize widgets to adjust the appearance and layout of your site. Editing widgets allows you greater control over what features your site has and how these features behave. Whether you are looking to capture leads, lead visitors from page to page, show off images, or put an important message in a paragraph, widgets can help.



To edit a widget, hover over the widget, and right-click the widget to see the context menu. Every widget has different options, but the following are common to almost every widget.


Edit Design

You can change the style of the widget, including color, text, images and more, as well as change the blank space surrounding the widget.

Click a widget, and click the Design tab.


Edit HTML/CSS

Allows you to make changes to the widget's HTML or CSS. We only recommend this option if you are comfortable with these languages.

Right-click the widget, and then click Edit HTML/CSS.


Entrance Animation

Allows you to customize how the element appears on the screen; for example, fading in, bouncing in, or zooming in.

Right-click the widget, click Entrance Animation, and select an animation.


Select Container

Selects the column or row this widget is contained in, allowing you to easily find and edit it.

Right-click the widget, click Select Container, and select Column or Row.


Copy and Paste

Copying a widget saves it so that you can paste it later in another location. The paste option only appears if you have a widget that has been copied.

Right-click the widget, and click Copy or Paste.


Hide on Device

Use the hide on device feature to change your content depending on the device your visitor uses to access your website. For example, show a click-to-call widget for mobile users or a contact form for desktop users. Widgets hidden by the Hide On Device feature are not deleted; you can see all of the hidden elements on a page by clicking Unhide Elements at the bottom of the left panel.

Right-click the widget, click Hide On Device, and select a device.


Set as Anchor

Anchor links let you send visitors to a specific section of the page, making it easier for them to get from place to place on a longer page or to a specific section that you want to reference. For more information about anchors, see Anchor Tags and Links.

Right-click the widget, and click Set As Anchor.


Delete

To delete a widget, removing it from all devices, right-click the widget, and click Delete.


Alignment

Set whether the widget is aligned to the left, right, or center of its area.

Some widgets behave very differently in different views. Check the way your widget displays in each view after adding it to make sure it displays correctly.

To set the alignment, right-click the widget, and click an Align Left, Align Center, or Align Right () icon.