Widget Customization - Cartally - AI mode for e-commerce

The Cartally widget is designed to blend into your store’s design. You can customize its appearance through the Cartally panel and via HTML attributes.

Panel settings

Go to Widget in the Cartally panel sidebar to configure:

Accent Color — the primary brand color used throughout the widget UI (buttons, highlights, active states).
Logo URL — a publicly accessible URL to your store’s logo, displayed in the widget header.

HTML attributes

You can further customize the widget by adding data- attributes to the script tag:

Attribute	Description	Default
`data-color-accent-primary`	Accent color (hex)	Panel setting or `#ffff81`
`data-logo-url`	URL to your shop logo	Panel setting
`data-language`	Force a specific UI language	Auto-detected
`data-currency`	Force a specific currency	Auto-detected
`data-trigger-selector`	CSS selector for custom trigger elements	Default search elements

Attributes set on the script tag take precedence over panel settings.

Example

<script
  src="https://app.cartally.co/widget.js"
  defer
  data-cartally-widget
  data-color-accent-primary="#e63946"
  data-logo-url="https://myshop.com/logo.png"
></script>

The widget UI is available in the following languages:

Code	Language
`en`	English
`pl`	Polish
`fr`	French
`de`	German
`es`	Spanish

The widget automatically selects the language based on the store page’s <html lang> attribute or the platform’s language object (e.g. prestashop.language.iso_code).

Trigger elements

By default, the widget attaches to common search elements in your theme. You can override this with data-trigger-selector or by adding the cartally-trigger CSS class to any element:

<button class="cartally-trigger">Search</button>

Multiple selectors can be combined:

data-trigger-selector=".search-btn, #header-search, .mobile-search-icon"

​Panel settings

​HTML attributes

​Example

​Supported widget languages

​Trigger elements

Panel settings

HTML attributes

Example

Supported widget languages

Trigger elements