Surveys are a great way to collect qualitative feedback from your users. Qualitative feedback enables you to gain more insight into your users' and how they view their experience with your product.
With PostHog, you can target surveys based on page URL, selectors, feature flag, and user properties. Then, you can analyze the results right in PostHog too!
Enable the survey beta
To access the survey beta, click your profile icon in the top right of your PostHog instance, select "Enable beta features," then activate "Surveys."
Setting up surveys
Setting up surveys is easy, and there are two ways to do it. The first option will enable you to get started quickly with a pre-built survey, while the second option involves creating your own UI components.
Option 1 (recommended)
Make sure you've installed and enabled the surveys app in your project's apps.
You must have the
opt_in_site_apps
option enabled in your PostHog initialization code.
posthog.init("<ph_project_api_key>", {"api_host": "<ph_instance_address>","opt_in_site_apps": true})
- That's it! Now you can go create a survey in PostHog.
Option 2 (custom UI component)
Make sure you're up to date on PostHog's JavaScript web library. Surveys requires version 1.67.1, or later.
Call
posthog.getSurveys()
and get a list of all surveys back, andposthog.getActiveMatchingSurveys()
to get a list of active matching surveys that should display for the current user client.
posthog.getActiveMatchingSurveys((surveys) => {// do something with surveys})
Note: You'll need to handle whether a user has seen a survey already or not manually if you're using this option. The survey app uses
localStorage
to keep track of this, which you can implement similarly in your code.
- In order for survey responses to be recorded, you'll need to send in a "survey sent" capture call event with the survey's name, ID, and any properties you'd want.
For example, if the survey's name is "New feature beta interest", you'd send in a capture call like this:
posthog.capture("New feature beta interest survey sent", {$survey_id: {survey.id} // required$survey_response: {survey_response} // required$survey_name: {survey.name} // optional})