How to integrate Receptive with your product

Why do I need to set up the Receptive integration?

It's pretty simple to install Receptive in your SaaS app.

In summary, you paste a javascript widget into your web app, and create a snippet of data that the widget will send to Receptive’s servers.

• Step 1: Install Receptive
• Step 2: Check your installation
• Step 3: Let your customers log in (via portal or widget)

Step 1: Install Receptive

We've made it really easy to install Receptive. 

Simply log in to Receptive, and then head to Settings > Install Receptive.

You can then follow the instructions there to build your snippet and install it.

NOTE:

If you are using modules:

• Use the key for "user.allowed_products" above when creating or updating your snippet to grant appropriate end-user (customer) access.
• The external ID for an existing module can be found by going to Settings > Modules and select "Manage modules". The ID is in parenthesis to the right of the module name.
• Leaving out the 'allowed_products' field in the snippet will leave the module settings for each user as currently set.
• To remove module access from users, you will need to specify an empty list as their allowed_products field. (However each user will always need at least one module associated, and if set to an empty list in the snippet, then the default (first) module will be assigned to the user.)

Once the widget is installed, your customers can access Receptive, create suggestions and see your roadmap. The best thing is you don’t have to set up and manage logins and passwords for your customers, the widget automates that.

Rails: Rails example on GitHub.

Angular and other single-page javascript apps work great, but you may need to take an extra step after your user logs in.

Step 2: Check your installation

Log in to your app, and using Chrome development tools or similar, look for a POST to http://api.eu-west-1.receptive.io/widget/ping. You should see a 200 OK response with a body containing {message:received}. If there are any problems with your snippet you’ll see an error message in the response.

Use the API Console to see what Receptive is receiving from your widget pings - this link API Console: Last 10 Pings. will show you the last 10 pings we’ve received on your account. Check the “data” field looks how you expect it to, i.e. no missing fields etc.

Step 3: Let your customers log in (via portal or widget)

There are two options for letting your customers login to Receptive.

1. Widget view

The embedded widget can be turned on in one click. Just go to "Settings" from the drop down menu, click "Customer view" and select "Widget view". 

By default you'll get a tab on the right-hand side of your app, saying "Suggest a Feature". See the following example install:

Below you will be able to change the location, color, and wording of the toggle / button. 

You can also use your own link / button to open the widget by selecting the option under "Custom toggle":

Click "Save" to enable your updates. 

Read more about the widget view here.

2. Portal view (default)

To use the portal view, you need to add a link, button, etc in your app so customers can click to access Receptive. See examples here.

To load Receptive on the current page, simply use the following:

<a href="#" onclick="receptivePublicLib.loginAndRedirect()">Suggest Features</a>

or to load Receptive in a new tab, use the following:

<a href="#" target="_blank" onclick="receptivePublicLib.loginAndRedirect({anchor: this})">Suggest Features</a>

Related:

See our security details here.