Add and edit widgets

  • Updated

Optimizely Configured Commerce has a robust Content Management System (CMS) that allows content editors and administrators the flexibility and control to design the look and feel of their website. Widgets are pre-configured content holders that allow you to rapidly add content to your pages without having to develop these elements.

Use widget templates to change the appearance of widgets on individual website pages, or create a custom template to change the appearance of a widget across all website pages.

It is important to understand the behavior of widgets when adding them to pages or categories. If a widget is added to a predefined page in the CMS, all pages of that same type will also display the widget. This is also true of the categories displayed within the CMS. As an example, referring to the image below, adding the Carousel widget to Apparel will also be displayed on the Gear and Bikes Category pages with the same content.

Add a widget to a page

Add the default widget template to a page, or add a custom widget template.

  1. To add a widget to a webpage, access the Admin Console.
  2. At the top of the screen, click View Website.
  3. Select the desired website from the list.
  4. Hover over Show CMS in the upper left corner and select the Show CMS pencil.
  5. Click Edit CMS in the upper left corner to edit.
  6. Select the desired page- it may be necessary to expand the sections to view all page options.
  7. Click Add Content to add a widget.
  8. Select the Item Type, and determine if the default template should be used by checking or unchecking the Use Default Template checkbox.

    If the Use Default Template checkbox is checked, the system assigns the widget template designated in the Admin Console as the default template for the selected Item Type (Content Item Class in the Admin Console). If the default template is changed in the Admin Console, it also changes in the CMS.

  9. If the Use Default Template check box is unchecked, a drop-down appears listing all widget templates available for the selected Item Type. Select a template, and click Next.
  10. If the selected Item Type requires any additional information, add it, then click Save.

Edit a widget

Edit an existing widget to change the widget template or other applicable information, such as CSS Class.

  1. Go to the Admin Console and at the top of the screen, click View Website.
  2. Click the Content Editor toggle to display On and then choose a website to edit.
  3. Hover over Show CMS in the upper left corner and select Show CMS.
  4. Click Edit CMS in the upper left corner to edit, then select a page.
  5. Click Edit Widget next to the widget that needs to be edited.

  6. To change the widget template, check the Use Default Template checkbox to assign the default template to the widget. Alternately, click the unlock link to unlock the template drop-down and select a different template.

  7. Edit the CSS Class or additional widget information as needed, then click Save.