Here you can find instructions on how to install and configure the Cartally AI Search widget in your PrestaShop store.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.
Installation
Step 1 — Add the widget script
Open your PrestaShop back office and edit the theme template files. You can do this via FTP or through Design → Theme & Logo → Advanced customization (if your theme supports it). Add the following code to one of these files in your theme directory (themes/your-theme/templates/_partials/):
head.tpl— inside the<head>section (recommended — thedeferattribute ensures the script loads after the page)footer.tpl— just before the closing</body>tag
Tip: Usinghead.tplis preferred because it’s less likely to be overridden by theme updates. Thedeferattribute guarantees the script won’t block page rendering.
Step 2 — Generate a Webservice API key
Cartally needs a read-only API key to sync your product catalog.- In the PrestaShop back office, go to Advanced Parameters → Webservice.
- Make sure the Webservice is enabled (toggle at the top of the page).
- Click Add new webservice key (the ”+” button).
- In the Key field, click Generate to create a random key, or enter your own.
- In the Permissions section, enable GET (read) access for the following resources:
productscategoriesimagesmanufacturerscombinations(if you use product variants)product_optionsandproduct_option_values(for attributes like size, color)languagescurrencies
- Leave all other permissions (PUT, POST, DELETE) unchecked.
- Click Save.
- Copy the generated API key.
Security: Only read (GET) permissions are required. Cartally never modifies your products, orders, or any other data.
Step 3 — Configure settings in the Cartally panel
- Log in to app.cartally.co.
- Go to Integration and enter your store’s URL.
- Select PrestaShop as the platform and paste the API key from Step 2.
- Click Save & Connect — Cartally will verify the connection and start syncing products.
Step 4 — Customize the widget
Go to Widget in the Cartally panel sidebar to set:- Accent Color — the main brand color used in the widget UI.
- Logo URL — a publicly accessible URL to your store’s logo.
Widget configuration options
You can customize the widget by addingdata- attributes to the script tag:
| Attribute | Description | Example |
|---|---|---|
data-color-accent-primary | Accent color (hex) | #e63946 |
data-logo-url | URL to your shop logo | https://myshop.com/logo.png |
data-language | Force a specific language | pl |
data-currency | Force a specific currency | PLN |
data-trigger-selector | CSS selector for custom trigger elements | .search-btn |
Full example with all options
Automatic language and currency detection
The widget automatically detects the language and currency that the customer is currently using, so you typically don’t need to setdata-language or data-currency manually.
On PrestaShop 1.7+ and 8.x the widget reads:
- Language — from
prestashop.language.iso_code(the global JS object available on every front-office page). - Currency — from
prestashop.currency.iso_code.
You can still override the automatic detection by explicitly settingdata-languageanddata-currencyon the script tag.
Attaching the widget to any element
The widget can be triggered by any element on the page — a button, link, icon, or any other HTML element. You choose the element by providing its CSS class or ID in thedata-trigger-selector attribute.
Option A — Use data-trigger-selector on the script tag
Specify a CSS selector (class or ID) that matches the element(s) you want to use as the widget trigger:
Option B — Add a class directly to the element
If you prefer, add thecartally-trigger class to any element in your theme template:
PrestaShop Classic theme example
The default search form in the Classic theme has the selector#search_widget. To replace it:
Tip: To find the correct selector for your theme, right-click the search element in your browser → Inspect → note theclassoridof the element.
Multilingual support
Cartally automatically detects and indexes products in all languages configured in your PrestaShop store.- Search works in the language currently selected by the customer.
- Autocomplete suggestions match the store’s active language.
- If a product is not translated, the store’s default language is used.
Currencies and localization
Cartally supports currencies configured in your store.- Customers always see prices in their currently selected currency.
- The widget reads the active currency from PrestaShop automatically.
- If a price is not available in a given currency, the store’s default currency is used.
Product synchronization
Products are synchronized with Cartally via the PrestaShop Webservice API.- An initial full sync runs when you first connect the integration.
- Subsequent syncs run periodically to keep the catalog up to date.
- You can trigger a re-sync from the Integration page in the Cartally dashboard.
Troubleshooting
Widget does not appear
Check if:- The script tag is placed before
</body>in your theme template. - The
srcURL (https://app.cartally.co/widget.js) is not blocked by a Content Security Policy or ad blocker. - There are no JavaScript errors in the browser console (F12 → Console).
Products not appearing in search
Check if:- The product is active (not disabled) in PrestaShop.
- The product has a name and description.
- The Webservice API key has read permissions for Products, Categories, and Images.
- The sync job has completed (check Integration page in the Cartally panel).
Wrong language or currency
If the widget shows the wrong language or currency:- Verify that
prestashop.language.iso_codeandprestashop.currency.iso_codeare available in your browser console. - If they are missing (custom theme), set
data-languageanddata-currencyexplicitly on the script tag.
AI does not respond or is slow
Possible reasons:- The AI request limit has been reached.
- There is temporary system overload.
- The query is very complex.
