PrestaShop | Yaplet

Overview

PrestaShop loads the active theme's assets/js/custom.js file at the end of every front-office page. Adding the Yaplet code to that file puts the chat widget on the whole shop. This works in PrestaShop 8 and 9.

PrestaShop has no back-office setting for adding code to every page, so this is a change to the theme's files. It needs access to the shop's files through FTP or the hosting's file manager. If you don't have that, send this page to your developer.

Installation Steps

Copy your Yaplet code

In your Yaplet dashboard, go to Brand → Chat widget and open the Install tab. If the tab asks where your website runs, choose Other website and switch off Include the <script> and </script> lines. Copy the code with the copy button on the code block.

custom.js is a JavaScript file, so the code must be plain JavaScript that starts with !function (Yaplet, with no <script> lines around it. If what you copied starts with a <script> line, leave out that first line and the last </script> line when you paste it.

Find the theme's folder

In the back office, go to Design → Theme & Logo. The first section of the page shows the name of the theme the shop uses. On the server, each theme has its own folder inside the themes folder of the PrestaShop installation.

Add the code to custom.js

In the theme's folder, open assets/js/custom.js. If it isn't there (the Hummingbird theme doesn't come with one), create an empty file with exactly that name and path. PrestaShop loads it whenever it exists.

Paste the Yaplet code at the end of the file on a new line, and save the file. If the shop uses a child theme, put the file in the child theme's folder.

Clear the PrestaShop cache

In the back office, go to Advanced Parameters → Performance and click Clear cache at the top of the page.

Check your shop

Open your shop in a new browser tab and reload it. The Yaplet chat button appears in the bottom-right corner. Click it to check that the chat opens.

Troubleshooting

The file is in the wrong place — PrestaShop only loads assets/js/custom.js from the folder of the theme the shop uses (or its parent theme). Check the theme name in Design → Theme & Logo and the file's path.
You added <script> tags — remove them. custom.js takes plain JavaScript, and the tags stop the code from running.
The shop still serves the old files — click Clear cache again in Advanced Parameters → Performance, then reload the shop in a private window.
The chat disappeared after a theme update — an update can change the theme's files. Check that the Yaplet code is still in custom.js, and add it again if it's gone.

The Installation page explains what the code does and lists every other platform guide.