<aside> đź’ˇ TL;DR

  1. Create your widget copy on WhatsApp Widget Generator
  2. Copy the HTML code, CSS link & JS link
  3. Download & upload ContentBox module
  4. Paste CSS & JS link in the <head> of theme.liquid
  5. Paste HTML in the content box
  6. Add ContentBox to a bodyhook </aside>

1. Creating the WhatsApp widget

You can create your own widget using the WhatsApp Widget Generator tool on Hoola’s website. This is the first step.

In there, you put your information:

  1. Welcome message text
  2. Teaser message text
  3. CTA button text
  4. Button Color

Untitled

And in the next step:

  1. Your WhatsApp business number
  2. Your pre-filled message

Hit “Generate”

Untitled

Your information is saved in an HTML code, this is what we need.

Test the link to see if it actually goes to your WhatsApp, and puts the right pre-filled message.

Hit “Copy” to copy the html code.

Untitled

2. Add the code in PrestaShop

For this, we’re using a module called “ContentBox” to load custom code in your theme.

Download the module at contentbox.org

Then, go to your store admin and upload the module

Untitled

Untitled

Then, hit set up to start configuring the setup.

Untitled

In the module’s content box, paste the following:

  1. Copy the script & stylesheet: