Skip to main content

Widgets

All pages are ultimately composed of widgets. These contain the actual page content and are added to a row or directly to a container.

Adding a Widget​

To add a widget, click Widgets in the top-right corner of the container. A panel with three tabs pops up, from where you can drag-and-drop the selected widget to the desired position.

Note the three tabs, corresponding to the three types of widget:

  • Custom widgets are created specifically for your shop by CloudSuite. You can change the content inside them.
  • Default widgets are available for all our customers. Note that not all default widgets are available in all page types.
    • Filters: Attributes that your customers can select on the PLP (based on product attributes from the CloudSuite App).
    • Search result: Displays products from the tree/tag of the page (based on linked products in the CloudSuite App).
    • Category index: Shows not products directly, but first an overview of the underlying trees/categories (based on the tree structure in the CloudSuite App).
    • Text Editor: Used for writing free text on the page, containing hyperlinks and images and with formatting as in many popular word processors.
    • Code Editor: A code field that can be placed on the page, allowing you to insert custom HTML code. Use this option carefully: incorrect HTML code can affect the page's functioning.
  • Static widgets are created specifically for you by CloudSuite with a consistent layout and structure and with fixed content that you cannot change.

Widgets can be grouped into widget groups. In each of the three tabs ungrouped widgets are shown first, followed by the widgets in groups.

Moving a Widget​

To move an existing widget to a different position on the page, click on the widget icon to drag-and-drop at the desired position.

Limiting Visibility​

If you are defining the widget content for specific Shops, Languages, and/or Campaigns only, choose them from the list. By default, the content will be shown in all shops and all languages, irrespective of any campaigns.

For each widget, you can configure in which language it should be displayed, under which campaign, and on which device. You can do this using these settings:

Managing a Widget​

If you need to align widgets on the page or add specific CSS classes, click on Layout to add a row.

Right-clicking on a widget will open a context menu.

Widget Menu

  • Select Edit to edit the widget. How exactly this is done, depends on the widget's type.
  • Select Delete to delete the widget.
  • Select Delete Translation to delete the widget's translations, if any exist. This action cannot be undone.
  • Select Go to Definition to go to the widget definition details.
Tags:
Last updated on