Heymarket Website Widget

Overview

The Heymarket Web Widget allows people to send messages from websites to your Heymarket inbox(es); also known as "click-to-text". It’s perfect to include on your company website, a pricing page, or customer support site. People can enter questions in the widget and a phone number to receive your reply. The Heymarket widget has been designed to be easily integrated with most websites including Squarespace, Wordpress, Weebly, and Google Tag Manager.

How it Works

The widget loads a small, floating message button on your site.  This button will stay fixed in the bottom right corner of the browser window, even as a user scrolls.

 

 

When it’s clicked, the floating message button will display a message dialog box. The user can enter their question and receive your reply as a normal text message on their phone - a seamless click-to-text experience.

 

 

 

Customizing the Widget and Creating the Code Snippet

The messaging dialog box is customizable and shows your company name, a welcome message, fields for a user to enter a phone number and message, and legal compliance text. You can also change the colors in the dialog box to match your website.

To add the Heymarket widget to your website, you must be able to add a custom code snippet of HTML/Javascript code into every web page that you want the widget to appear.  Many web hosting services provide an easy way to do this.  Read below for specific steps for adding the widget to Squarespace, Wordpress, Weebly, and Google Tag Manager.

Here is how you can customize the widget and create the custom code snippet:

1. As an administrator, sign in Heymarket Web and go to the Manage Integrations page.
2. Next to ‘Website Widget’, click on the ‘Setup’ button.
3. Select which Heymarket inbox that widget messages will appear in.
4. You can now configure the look and feel of the widget: your company name, the welcome message, legal compliance text, and even colors.
5. Now enter the website(s) where this widget will appear.
6. Click the ‘Get Widget Code’ button. You will see a code snippet for the widget you just customized. Select the code snippet and copy it.
7. The recommended placement of the code snippet is just prior to the closing body tag (</body>).  This ensures that the widget will not impact the performance of your website. If the website uses any theming template, placing the widget code snippet in the theme footer is a quick way to implement the widget on every page on your site in which the footer is shown.

Setup for Squarespace Websites

To insert the widget snippet on a Squarespace site, you must be subscribed to at least the Business level package that allows inserting custom HTML and Javascript.  The snippet can be inserted into every page in the Squarespace site with just a few quick steps:

1. Sign in your Squarespace account and go to the Site Settings.
2. Select the Advanced menu option under Website.
3. Select the Code Injection menu option.
4. Paste your widget code snippet directly into the Footer box. Save your site and you are done!

Visit your site and send a quick message from the widget to test it.

 

Setup for Wordpress Blogs and Websites

After setting up the widget, you can download a Wordpress plugin directly from the page. This plugin just needs to be uploaded to Wordpress and activated, no setup required. If you install the plugin off the Wordpress Plugin directory, as shown in the above screenshots, you must set up the plugin with your Client ID.

The Client ID can be found on the widget integration page after the widget has been set up and the code is displayed, a "Copy Client ID" button appears just above the code, next to the WordPress download button. Clicking this button will copy the Client ID to the clipboard and it can then be pasted in the plugin settings on the Wordpress site. Once the plugin is activated and has a Client ID saved, the widget will appear on every page of the site. The custom code (without the WordPress plugin) for the HeyMarket Web Widget is also compatible with a smaller set of WordPress pages (Microsites).

Setup for Weebly Websites

The Heymarket widget can also appear on Weebly sites with these simple steps:

1. Open your Weebly site in editing mode and click on Settings in the top menu bar.
2. Click the SEO menu option on the left.
3. Paste the Heymarket widget code snippet into the Footer Code box.
4. Click the Save button in the bottom right, then the Publish button in the top right.

Your Heymarket widget is now active on your Weebly site and people can click to text you messages from there!

Setup for Google Tag Manager

Google Tag Manager provides a simple way to manage custom snippets of code on your website. If your site has Google Tag Manager setup, you can add the Heymarket widget in just a few steps:

1. Sign in to Google Tag Manager and click on ‘New Tag’.
2. Give the new tag a name (e.g., Heymarket Widget) and click inside the Tag Configuration box to select a tag type.
3. Select the Custom HTML tag type.
4. Paste the widget snippet code inside the HTML box.
5. Click inside the Triggering box to select a trigger for the tag.
6. Select All Pages. Save and deploy your changes.

The Heymarket Widget should now be active on your site people can now click-to-text!

Setup for Shopify Stores
To add the Heymarket Website Widget to a Shopify Store, you will need copy and paste the code snippet into your Shopify theme. This can be done by following these steps:

1. From the Shopify admin, go to Online Store > Theme.
2. Navigate to the theme and then select Action > Edit code.
3. In the Layout section, click theme.liquid to open the file in the online code editor.
4. Find </body> and paste code for widget code snippet just above this

 

Note:

The widget has two requirements:

1. A javascript snippet needs to be included in the html page

2. The allowed domains need to be set on the widget settings. If you need to install the widget on sub domains, the widget code snippet will have to be included on the pages of main and sub domains and the domains need to be added to the allowed list. If you do not want the widget on a specific subdomain, exclude the snippet.