Layout

There is no separate Layout tab any more. The layout of a widget is set on the General tab, and its position and size on the Branding tab. Each widget has its own settings, and nothing reaches your website until you click Save at the top of the page.

1. Go to Widgets
2. Select the widget to modify
3. Open the General or the Branding tab, as described below

Template

On the General tab, the Template card sets the widget’s layout: Launcher, Embedded, Overlay or Pill. See Layouts for what each one looks like. The preview on the right switches as soon as you click a template.

• Pill is a chat-only layout, so choosing it turns chat on and search off.
• Chat stays on only when you switch to Launcher. When a switch would leave the widget with neither search nor chat, search is turned on.
• For Embedded widgets, enter the Element selector: the CSS selector of the element on your page where the widget is placed, for example #target-element. Make sure that element exists on the pages where the widget should appear.

Switching templates doesn’t change the installation script, but the new layout may need different markup on your page, such as the target element of an embedded widget.

Placement and size

On the Branding tab:

• Placement moves a launcher left or right and offsets it from the screen edges, with separate offsets for mobile. For a pill, it sets the vertical offsets and an optional element to mount it in.
• Size and borders sets the searchbar height of embedded and overlay widgets, and the element height of embedded widgets.
• Border Radius (in the Style card) sets how rounded the widget’s corners are.
• Launcher Button (Pill Button for pills) sets the text and look of the button visitors click to open the widget.

Branding describes these settings in detail.

Stacking level

For launcher widgets and floating pill widgets, the Placement card on the Branding tab also has a Stacking level: the CSS z-index of the launcher button. It decides which elements of your page appear in front of the launcher. Increase it if another element, such as a cookie banner, covers the launcher; decrease it if the launcher covers something it shouldn’t. The default is the maximum supported value, 2147483646, so in most cases you can leave it as it is. The preview doesn’t show the stacking level. See Branding.