Prestashop Integration

<< Click to Display Table of Contents >>

  Integrations > Shopping Cart Integrations > Prestashop >

Prestashop Integration

How to add your Live Chat Button to Prestashop website

 

Adding Live Chat Button with help of free HTML module for Prestashop 1.5. and 1.6

 

In order to add a chat button to PrestaShop-based website, you would need to download and install a free HTML module contentBox. It allows you to add a new text block or HTML / Javascript code to your website.

 

To start Live Chat and Prestashop integration process, please do the following:

 

1.Download the module from http://contentbox.org/

2.Login to your Prestashop Admin Panel

3.Follow Modules / Modules in the top menu

4.Click 'Add new module' button

5.Browse for the module file you downloaded and press 'Upload this module' button

 

contentBox uploading

contentBox module uploading

 

6.After this the module will appear in the list of modules

7.Find contentBox module and press 'Install' button for it to proceed with module installation

 

contentBox installation

contentBox module installation

 

8.Now it's time to get the code for your live chat button. For this, please log into your account Control Panel on Provide Support website and follow My Account / Chat Button Codes page there

9.The best option will be to generate the floating chat button code, which will let your live chat button appear at a fixed position. For this purpose, please choose Fully Featured Chat Button Code with Uploadable Online / Offline Images and check an option 'Generate a floating chat button code'

10.Then specify vertical and horizontal values for your live chat button position and copy the code.

11.Find the contentBox module you installed and click 'Configure' for it.

12.In the appeared editor click 'Edit HTML source button' and insert the chat button code you have generated and copied

 

contextBox updating

Inserting chat button code to a module

 

13.Click 'Update' button in the editor window and then 'Update (Save)' button in the module configuration.

14.The chat button will appear on your website in the defined position

 

How to hook your Prestashop module

 

If for some reason the live chat button does not appear, please ensure you hooked the module to the proper position. To hook the module, please do the following:

 

1.In your Prestashop admin follow Modules / Positions

 

Module Position

Module Position

 

2.Click 'Transplant a module' button Transplant a module button

3.In the appeared configuration window choose your module and the position to hook it into. We recommend hooking our live chat module into the page footer.

 

Hooking the module

Hooking the module

 

Adding Live Chat Button with help of free HTML module for Prestashop 1.7.

 

1.Download HTML box module from here

2.Follow Modules / Modules and Services menu

 
 

Modules and Services menu

Modules and Services menu

 
3. Click 'Upload a Module' buttonUploading Prestashop module
4. Choose the path to your module file and wait for the installation to complete
5. Click 'Configure' button

 
 

Prestashop module configuration

Prestashop module configuration

 

 
6. Generate the chat button code for fixed position
7. Choose the location for your content box.

 
 

Prestashop module appearance

Prestashop module appearance

 

 
8. Click 'Edit HTML source button'

 
 

Editing HTML source code in Prestashop module

Editing HTML source code in Prestashop module

 

 
9. Insert the code into the HTML source editor
10. Save changes.

 

How to disable HTML purifier

 
If you have HTML purifier enabled in your settings, please disable it following these steps. HTML purifier will modify our chat button code and it will not work properly, that is why it should be disabled.

 
1. Follow Shop Parameters / General
2. Disable 'HTML Purifier' option
3. Save changes

 

Adding Live Chat Button directly to Prestashop theme for any version of Prestashop

 

For adding live chat button to your Prestashop theme directly you need to have access to your Prestashop files via standard FTP client or the cPanel File manager.

 

To integrate Provide Support Live Chat system with your Prestashop-based website, please do the following:

 

1.Access your Prestashop files via FTP client or Cpanel File manager

2.Open there Prestashop / Themes / Your theme name folder, in our example the default theme is used. You can check the name of your theme in your Prestashop admin panel in Preferences / Theme

 

Prestashop FTP

Prestashop files on FTP

 

3.We will recommend adding the live chat button code to your footer, so open in Notepad footer.tpl file which is located in your theme folder

4.Log into your account Control Panel on Provide Support website and follow there My Account / Chat Button Codes page

5.Generate there the code which will display your live chat button tied to a fixed position on your browser window (bottom right corner, for example). For this purpose choose Fully Featured Chat Button Code with Uploadable Online / Offline Images and check an option 'Generate a floating chat button code'. Then specify vertical and horizontal position for your live chat button.

6.Copy the code and insert it to the footer.tpl before closing </body> tag.

7.Before <script type="text/javascript"> insert {literal}, then add {/literal} after closing </script> tag. This will prevent Prestashop template engine from evaluating your live chat button code.

8.Save your changes and upload your updated footer.tpl file to your FTP or Cpanel.

9.The chat button will appear in the position specified in your chat button code

 

Prestashop chat button example

Live Chat button at Prestashop website bottom corner