Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.cartally.co/llms.txt

Use this file to discover all available pages before exploring further.

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:
AttributeDescriptionDefault
data-color-accent-primaryAccent color (hex)Panel setting or #ffff81
data-logo-urlURL to your shop logoPanel setting
data-languageForce a specific UI languageAuto-detected
data-currencyForce a specific currencyAuto-detected
data-trigger-selectorCSS selector for custom trigger elementsDefault 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>

​
Supported widget languages

The widget UI is available in the following languages:
CodeLanguage
enEnglish
plPolish
frFrench
deGerman
esSpanish
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"