Whatfix Community is a free-to-use platform that helps websites onboard users with the help of onboard users with the help of Whatfix Flows. Whatfix Flows are interactive walk-throughs that you can create on any website using Whatfix’s Flows Editor.
Install Whatfix’s Flows Editor is available for Chrome and Firefox, it’s free.
Startups like Trainman, Playnlive and Autowaale have already found new strides of success after integrating Whatfix Community flows into their web application.
Click here to see how Trainman hand-holds their visitors via Whatfix flows
In this post, we show ways to integrate Whatfix Community flows into your web application.
Wondering how to get started with Whatfix Flows, click here to learn how

How to integrate Whatfix Flows into your website?

You need not be tech savvy to create and integrate flows. It is a very simple process that can be done in a few minutes. Here’s how you can get started with it:

  1. Create an account on Whatfix Community.
  2. Install Whatfix Flows Editor (our browser extension) on your Google Chrome or Firefox browser.
  3. Create the flow on your website by launching Whatfix Flows Editor extension.
  4. Once you are done with creation, publish the flow on Whatfix Community.
  5. After publishing, click on the view button to view the flow.
  6. On the top menu of the flow, you will see the embed drop down menu, just beside the orange ‘See live button‘.
  7. The embed drop down menu will show you the multiple formats that you can use.

embed whatfix in multiple formats
For implementing self-service, we recommend you to use our two commonly used integration methods.

1. Self-help widget

Visitors and users on your website will be able to view live contextual help with Whatfix’s Self-help widget. This widget can be personalized and positioned according to your preference.
Here’s how you can integrate the Self-help widget:

  1. Select the Self-help widget option under the embed drop down menu.
  2. Choose which all flows you would like to include in your Self-help widget, as per tag or hostname.
  3. Choose your preferred position for the Self-help widget on the web application. image

Copy the code snippet displayed, on the desired pages of your web application. Here’s a screenshot of the code snippet:                                                                                                     2

2. JavaScript 

Whatfix flows created on your web application can be automatically triggered on user interaction by integrating JavaScript. This will run the flows as live instructions and can hand-hold your users promptly across all the touch points on your web application.
Here’s how you can integrate Whatfix’s JavaScript:

  1. Select the JavaScript option under the embed drop down menu.
  2. Copy the JavaScript code for integrating Whatfix. Here’s a screenshot of the code snippet:

3.Paste the JavaScript code in the header section of all your web pages, in the head section as: 


<script language=’javascript’ async=’true’ type=’text/javascript’ src=’//whatfix.com/embed/embed.nocache.js’></script>


or in the footer section as:

</body><script language=’javascript’ async=’true’ type=’text/javascript’ src=’//whatfix.com/embed/embed.nocache.js’></script>

4. Call the function to trigger the flow and run live instructions.
5. Further on, you can customize the JavaScript to:
a. Display the flow as a tour – shown only to first-time users.
b. Launch a live flow on user click. (This can be done by adding the appropriate if condition.)
Click here to learn more about integrating with Javascript.
For any more information about the integration of Whatfix, contact our Community Manager here.

Related Articles