> ## 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. # PrestaShop Here you can find instructions on how to install and configure the Cartally AI Search widget in your PrestaShop store. ## 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 `` section (recommended — the `defer` attribute ensures the script loads after the page) * **`footer.tpl`** — just before the closing `` tag ```html theme={null} ``` > **Tip:** Using `head.tpl` is preferred because it's less likely to be overridden by theme updates. The `defer` attribute 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. 1. In the PrestaShop back office, go to **Advanced Parameters → Webservice**. 2. Make sure the Webservice is **enabled** (toggle at the top of the page). 3. Click **Add new webservice key** (the "+" button). 4. In the **Key** field, click **Generate** to create a random key, or enter your own. 5. In the **Permissions** section, enable **GET** (read) access for the following resources: * `products` * `categories` * `images` * `manufacturers` * `combinations` (if you use product variants) * `product_options` and `product_option_values` (for attributes like size, color) * `languages` * `currencies` 6. Leave all other permissions (PUT, POST, DELETE) **unchecked**. 7. Click **Save**. 8. 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 1. Log in to [app.cartally.co](https://app.cartally.co). 2. Go to **Integration** and enter your store's URL. 3. Select **PrestaShop** as the platform and paste the API key from Step 2. 4. 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 adding `data-` 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 ```html theme={null} ``` ## 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 set `data-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`. This means if your store supports multiple languages and currencies, the widget will match the customer's current selection automatically. > You can still override the automatic detection by explicitly setting `data-language` and `data-currency` on 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 the `data-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: ```html theme={null} ``` You can pass multiple selectors separated by commas: ```html theme={null} data-trigger-selector=".search-btn, #header-search, .mobile-search-icon" ``` ### Option B — Add a class directly to the element If you prefer, add the `cartally-trigger` class to any element in your theme template: ```html theme={null} ``` ### PrestaShop Classic theme example The default search form in the Classic theme has the selector `#search_widget`. To replace it: ```html theme={null} data-trigger-selector="#search_widget" ``` > **Tip:** To find the correct selector for your theme, right-click the search element in your browser → **Inspect** → note the `class` or `id` of 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 `` in your theme template. * The `src` URL (`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_code` and `prestashop.currency.iso_code` are available in your browser console. * If they are missing (custom theme), set `data-language` and `data-currency` explicitly 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. Solution: Check **Dashboard → Usage Overview → AI Requests** in the Cartally panel.