How To Install HelperHat

Installing HelperHat on your website is quick and easy. Follow the steps below to start providing simplified customer support with HelperHat.

Copy the HelperHat Installation Code

To begin you'll need your unique HelperHat installation code which is provided during the HelperHat onboarding steps. It should look something like this:

If you've already signed up successfully, then follow these instructions to get your installation code:

1. Log in to your HelperHat account.
2. Go to the Settings page on HelperHat.
3. Copy the installation code provided. It should look something like this:

Install HelperHat to Your Website

Once you have the code, add it to your website's HTML. Here's how:

1. Access your website's HTML files. Depending on how your site is built, you might need to log into your content management system (CMS) or use an FTP client to access your files directly.
2. Locate the closing </body> tag in the HTML of each page where you want to enable HelperHat. This is usually found near the bottom of your HTML files.
3. Paste the HelperHat installation code directly before the closing </body> tag.
4. Save and upload your changes. If you're using a CMS, simply save your updates. If you're editing files directly, be sure to upload the modified files back to your server.

Install HelperHat on a WordPress Website

1. Follow the steps above to copy the HelperHat installation code from your HelperHat account settings.
2. Log in to your WordPress account.
3. Go to Appearance > Theme Editor and add the installation code just before the closing </body> tag of the footer.php file.
4. Paste in the installation code and select Update File.

Note: If your website is hosted on WordPress.com, you cannot add the HelperHat installation code to your website unless you are on their Business plan. The other plans (e.g. Premium, Personal) do not allow users to add JavaScript code.

Install HelperHat on a Shopify Page

1. Follow the steps above to copy the HelperHat installation code from your HelperHat account settings.
2. Log in to your Shopify admin dashboard.
3. In the left sidebar menu, navigate to Online Store > Themes.
4. Click the Actions dropdown menu and select Edit code.
5. Select the theme.liquid file for your theme.
6. Paste your HelperHat installation code just before the </body> tag in this file.
7. In the upper right, click Save.

Install HelperHat on a Drupal Website

1. Follow the steps above to copy the HelperHat installation code from your HelperHat account settings.
2. Log in to your Drupal admin dashboard.
3. In the main navigation menu, navigate to Structure.
4. Click Blocks.
5. Click + Add Block.
6. Enter the fields for your new block. Paste the installation code in the Block body field and then click Save block.

Install HelperHat on a Magento Website

Follow the steps above to copy the HelperHat installation code from your HelperHat account settings. Then follow Magento's design user guide for instructions on installing third-party JavaScript code in the Header HTML.

Install HelperHat on a Wix Website

Use the App Market in Wix to add an HTML widget to your page:

1. Follow the steps above to copy the HelperHat installation code from your HelperHat account settings.
2. Go to Settings in your site's dashboard.
3. Click the Custom Code tab in the Advanced section.
4. Click + Add Custom Code at the top right.
5. Paste the installation code in the text box.
6. Set the Name of the new tool to HelperHat Installation Code.
7. Under Add Code to Pages, click the radio button for All pages and use the dropdown menu to select Load code on each new page.
8. Under Place Code in the section, click the radio button for Body - end option.
9. Click Apply to save your changes.

Note: If you're integrating HelperHat on your Wix website, you have two options: you can follow the steps above to add the chat feature to every page, or you can send instructions to your webmaster to configure the customer support chat widget for specific pages.

Install HelperHat on a Joomla Website

There are two ways to add your HelperHat tracking code to your Joomla site. With either method, follow the steps above to copy the HelperHat installation code from your HelperHat account settings first.

1. You can select an extension from the Joomla Extension Directory where you can paste in the HelperHat installation code. Alternatively, you can follow the steps below to install the installation code:
2. Log in to your Joomla account as an administrator.
3. In the main navigation menu, navigate to Extensions > Templates > Templates.
4. Click the name of your template and select index.php in the left sidebar menu.
5. Paste the HelperHat installation code directly above the </body> tag.
6. Click Save.

Install HelperHat on a Squarespace Website

1. Follow the steps above to copy the HelperHat installation code from your HelperHat account settings.
2. Log in to your Squarespace account.
3. In the left sidebar menu, navigate to Settings.
4. In the Website section of the menu, navigate to Advanced, then select Code Injection.
5. Paste the installation code into the Header field.
6. In the upper left, click Save.

Verify Installation

To make sure HelperHat is correctly installed, follow these steps:

1. Clear your browser cache to ensure you see the most up-to-date version of your website.
2. Visit your website and navigate to a page where you added the HelperHat code.
3. Look for the HelperHat widget to appear, usually at the bottom corner of your webpage.

If you see the HelperHat widget, congratulations! You've successfully installed HelperHat.

Troubleshooting

If the HelperHat widget does not appear:

• Double-check the code: Make sure you copied the entire HelperHat installation code without any changes.
• Verify the placement: Ensure the code is placed directly before the </body> tag.
• Check your browser's console for errors: Sometimes JavaScript errors can prevent the widget from loading.

If you continue to experience issues, please contact us at [email protected] for assistance.

Need Help?

If you're not familiar with editing HTML or don't have access to your website's code, you can send the installation instructions to your webmaster. Click the “Copy Email Instructions” button in your HelperHat dashboard to copy the instructions, then paste them onto a new email and send to your webmaster.