Skip to content

Commit

Permalink
chore(surveys): I renamed the "Targeting" section to "Display conditi…
Browse files Browse the repository at this point in the history
…ons", so this updates all of the docs to reference that new name (#8940)

* I think I got all the spots

* old file, no longer used
  • Loading branch information
dmarticus committed Jul 15, 2024
1 parent e4c19b2 commit 30102dc
Show file tree
Hide file tree
Showing 19 changed files with 45 additions and 67 deletions.
2 changes: 1 addition & 1 deletion contents/docs/api/decide.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ sidebar: Docs
showTitle: true
---

The `decide` endpoint is used to evaluate a feature flag for a given user. This means it is the main endpoint not only for feature flags, but also experimentation, early access features, and survey targeting.
The `decide` endpoint is used to evaluate a feature flag for a given user. This means it is the main endpoint not only for feature flags, but also experimentation, early access features, and survey display conditions.

It is a POST-only public endpoint that uses your [project API key](https://app.posthog.com/project/settings) and does not return any sensitive data from your PostHog instance.

Expand Down
2 changes: 1 addition & 1 deletion contents/docs/libraries/js/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -292,7 +292,7 @@ To check flag status for a different group, first switch the active group by cal

## Surveys

[Surveys](/docs/surveys) launched with [popover presentation](/docs/surveys/creating-surveys#presentation) are automatically shown to users matching the [targeting](/docs/surveys/creating-surveys#targeting) you set up.
[Surveys](/docs/surveys) launched with [popover presentation](/docs/surveys/creating-surveys#presentation) are automatically shown to users matching the [display conditions](/docs/surveys/creating-surveys#display-conditions) you set up.

To disable loading surveys in a specific client, you can set the `disable_surveys` [config option](#config).

Expand Down
18 changes: 10 additions & 8 deletions contents/docs/surveys/creating-surveys.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ export const newSurveyLight = "https://res.cloudinary.com/dmukukwp6/image/upload
export const newSurveyDark = "https://res.cloudinary.com/dmukukwp6/image/upload/posthog.com/contents/images/docs/surveys/new-survey-dark-mode.png"
export const delaySurveyLight = "https://res.cloudinary.com/dmukukwp6/image/upload/Screenshot_2024_06_25_at_11_09_57_AM_fb3b007108.png"
export const delaySurveyDark = "https://res.cloudinary.com/dmukukwp6/image/upload/Screenshot_2024_06_25_at_11_09_41_AM_52fd4a8e34.png"
export const displayConditionsLight = "https://res.cloudinary.com/dmukukwp6/image/upload/Screenshot_2024_07_10_at_9_52_48_AM_6287f11b96.png"
export const displayConditionsDark = "https://res.cloudinary.com/dmukukwp6/image/upload/Screenshot_2024_07_10_at_9_52_35_AM_3fefd0b9cc.png"

<iframe
src="https://www.youtube-nocookie.com/embed/2jQco8hEvTI?start=900"
Expand Down Expand Up @@ -83,26 +85,26 @@ Customization enables you to change the look, feel, and timing of your popover s
classes="rounded"
/>

### Targeting
### Display conditions

This specifies the conditions a user must meet to be shown the survey. A user must meet **ALL** the conditions to be eligible.

You can target your survey to specific users based on:
You can display your survey to specific users based on:

- **Linked feature flag:** Whether a user has a specific [feature flag](/docs/feature-flags) enabled. For example, if you're rolling out a new landing page using a feature flag `new-landing-page`, you can gather feedback only from users who have that flag enabled. This is also a way to show surveys to cohorts (but it must be a [non-behavioral one](/docs/feature-flags/common-questions#why-cant-i-use-a-cohort-with-behavioral-filters-in-my-feature-flag)).

- **URL targeting:** Show when URL either contains a string, exactly matches a string, matches a regex.

- **Selector matches:** Whether a specific element exists or appears on the page with the specified class name or ID. For example, you can target a survey with `#my-button` or `.my-button` selector. This is useful for showing a survey after a user action.
- **Selector matches:** Whether a specific element exists or appears on the page with the specified class name or ID. For example, you can display a survey with `#my-button` or `.my-button` selector. This is useful for showing a survey after a user action.

- **Wait period**: Hide surveys from users who have seen a survey in the last X days. Note that a user who completes a survey are never shown the same survey again, even if no wait period is set.

- **User and group properties:** If you are capturing [person profiles](/docs/data/persons), you can target a survey to users who have specific [user](/docs/product-analytics/person-properties) or [group properties](/docs/product-analytics/group-analytics#how-to-set-group-properties). For example, you can target a survey to users who have a property `is_paying=true`. This also includes a percentage rollout option.
- **User and group properties:** If you are capturing [person profiles](/docs/data/persons), you can display a survey to users who have specific [user](/docs/product-analytics/person-properties) or [group properties](/docs/product-analytics/group-analytics#how-to-set-group-properties). For example, you can target a survey to users who have a property `is_paying=true`. This also includes a percentage rollout option.

<ProductScreenshot
imageLight="https://res.cloudinary.com/dmukukwp6/image/upload/v1714693687/posthog.com/contents/images/docs/surveys/target-light.png"
imageDark="https://res.cloudinary.com/dmukukwp6/image/upload/v1714693687/posthog.com/contents/images/docs/surveys/target-dark.png"
alt="Targeting"
imageLight={displayConditionsLight}
imageDark={displayConditionsDark}
alt="Display conditions"
classes="rounded"
/>

Expand All @@ -114,7 +116,7 @@ This enables you to stop your survey once you receive a specific number of respo

Once you've set up your survey, click "Save as draft" to save your survey. This enables you to review any changes before launching. Then, when you're ready to launch, click the "Launch" button.

If you've created a [popover survey](#presentation), your survey will begin showing immediately to users matching your targeting.
If you've created a [popover survey](#presentation), your survey will begin showing immediately to users matching your display conditions.

If you've created an [API survey](#presentation), you'll need to add your [custom survey code](/docs/surveys/implementing-custom-surveys) before launching.

8 changes: 4 additions & 4 deletions contents/docs/surveys/implementing-custom-surveys.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -47,17 +47,17 @@ The benefit of using PostHog beyond this is that it handles:

1. **Survey content.** Customize question type, text, and more. Change it at runtime without needing to redeploy your app.

2. **Targeting logic.** This means not showing the same survey multiple times, the wrong survey, or a survey that has collected enough responses. Leverage property filters, cohorts, feature flags, and more.
2. **Display conditions.** This means not showing the same survey multiple times, the wrong survey, or a survey that has collected enough responses. Leverage property filters, cohorts, feature flags, and more.

If you create a [popover survey](/docs/surveys/creating-surveys#presentation), updating and targeting are handled automatically. When you create one in **API mode**, you need to add logic to fetch and display surveys yourself with the help of the [JavaScript Web SDK or snippet](/docs/libraries/js).
If you create a [popover survey](/docs/surveys/creating-surveys#presentation), updating and display conditions are handled automatically. When you create one in **API mode**, you need to add logic to fetch and display surveys yourself with the help of the [JavaScript Web SDK or snippet](/docs/libraries/js).

## Fetching surveys

When implementing an API survey, there are two options for fetching surveys from PostHog:

1. To get all surveys, call `getSurveys(callback, forceReload)`. This means you still need to handle targeting yourself.
1. To get all surveys, call `getSurveys(callback, forceReload)`. This means you still need to handle display conditions yourself.

2. To get surveys enabled for the current user, call `getActiveMatchingSurveys(callback, forceReload)`. This always returns an active survey if the user meets the targeting conditions, even if they have already seen, dismissed, or responded to the survey.
2. To get surveys enabled for the current user, call `getActiveMatchingSurveys(callback, forceReload)`. This always returns an active survey if the user meets the display conditions, even if they have already seen, dismissed, or responded to the survey.

Surveys are requested on first load and then cached by default by the JavaScript SDK. If you want to force an API call to get an updated list of surveys, pass `true` to the `forceReload` parameter. You only need to do this if you want changed surveys to appear mid-session for users.

Expand Down
24 changes: 0 additions & 24 deletions contents/docs/surveys/targeting.mdx

This file was deleted.

6 changes: 3 additions & 3 deletions contents/tutorials/angular-surveys.md
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,7 @@ This tutorial will cover how to implement both options:

### Option 1: Use PostHog's prebuilt survey UI

This is the simplest option. PostHog has a variety of [survey templates](/templates?filter=type&value=survey) to choose from, handles all the display logic, and captures responses for you. You can also customize the questions, branding, and targeting as needed – see our [survey docs](/docs/surveys/creating-surveys) for more details on how to do so.
This is the simplest option. PostHog has a variety of [survey templates](/templates?filter=type&value=survey) to choose from, handles all the display logic, and captures responses for you. You can also customize the questions, branding, and display conditions as needed – see our [survey docs](/docs/surveys/creating-surveys) for more details on how to do so.

To create a survey with a prebuilt UI, go to the [surveys tab](https://us.posthog.com/surveys) in PostHog and click "New survey".

Expand All @@ -110,7 +110,7 @@ To create a survey with a prebuilt UI, go to the [surveys tab](https://us.postho
Select any template, or you can create your own by clicking "Create blank survey". Then, configure your survey with the following details:

1. Ensure `Presentation` is set to **Popover**.
2. Set the targeting to `All users`.
2. Set the display conditions to `All users`.
3. Use the default values for everything else.

Then, click "Save as draft" and then "Launch". Your survey is now live and you should see it in your app. After submitting responses, you can [view results in PostHog](#4-view-results).
Expand Down Expand Up @@ -265,7 +265,7 @@ This shows a survey popup every time you visit your app's homepage.

#### 2. Fetch the survey from PostHog

PostHog keeps track of all active surveys for a user (this is especially helpful if you set up [custom targeting options](/docs/surveys/creating-surveys#targeting)).
PostHog keeps track of all active surveys for a user (this is especially helpful if you set up [custom display conditions](/docs/surveys/creating-surveys#display-conditions)).

To fetch the active surveys, we use `posthog.getActiveMatchingSurveys()`. This returns an array of survey objects that looks like this:

Expand Down
6 changes: 3 additions & 3 deletions contents/tutorials/astro-surveys.md
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,7 @@ This tutorial will cover how to implement both options:

### Option 1: Use PostHog's prebuilt survey UI

This is the simplest option. PostHog has a variety of [survey templates](/templates?filter=type&value=survey) to choose from, handles all the display logic, and captures responses for you. You can also customize the questions, branding, and targeting as needed – see our [survey docs](/docs/surveys/creating-surveys) for more details on how to do so.
This is the simplest option. PostHog has a variety of [survey templates](/templates?filter=type&value=survey) to choose from, handles all the display logic, and captures responses for you. You can also customize the questions, branding, and display conditions as needed – see our [survey docs](/docs/surveys/creating-surveys) for more details on how to do so.

To create a survey with a prebuilt UI, go to the [surveys tab](https://us.posthog.com/surveys) in PostHog and click "New survey".

Expand All @@ -163,7 +163,7 @@ To create a survey with a prebuilt UI, go to the [surveys tab](https://us.postho
Select any template, or you can create your own by clicking "Create blank survey". Then, configure your survey with the following details:

1. Ensure `Presentation` is set to **Popover**.
2. Set the targeting to `All users`.
2. Set the display conditions to `All users`.
3. Use the default values for everything else.

Then, click "Save as draft" and then "Launch". Your survey is now live and you should see it in your app. After submitting responses, you can [view results in PostHog](#4-view-results).
Expand Down Expand Up @@ -305,7 +305,7 @@ This shows a survey popup every time you visit your app's homepage.

#### 2. Fetch the survey from PostHog

PostHog keeps track of all active surveys for a user. This is especially helpful if you set up [custom targeting options](/docs/surveys/creating-surveys#targeting).
PostHog keeps track of all active surveys for a user. This is especially helpful if you set up [custom display conditions](/docs/surveys/creating-surveys#display-conditions).

To fetch the active surveys, we use `posthog.getActiveMatchingSurveys()`. This returns an array of survey objects that looks like this:

Expand Down
2 changes: 1 addition & 1 deletion contents/tutorials/beta-feedback.md
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ Now, when users opt into the "new beta page" feature, a button shows on the home

Lastly, we want to get feedback on our new beta page from the users in our beta. We can add this without adding code using [surveys](/docs/surveys).

To create a survey, go to the [surveys tab](https://app.posthog.com/surveys) in PostHog and click "New survey." Choose the [open feedback template](/templates/in-app-feedback-survey), fill out any details, and open the targeting section. In this section, we target the `new-beta-page` feature flag and the `/beta` URL. This prevents non-beta users from getting the survey. Once done, click save and launch.
To create a survey, go to the [surveys tab](https://app.posthog.com/surveys) in PostHog and click "New survey." Choose the [open feedback template](/templates/in-app-feedback-survey), fill out any details, and open the display conditions section. In this section, we target the `new-beta-page` feature flag and the `/beta` URL. This prevents non-beta users from getting the survey. Once done, click save and launch.

![Creating survey video](https://res.cloudinary.com/dmukukwp6/video/upload/v1710055416/posthog.com/contents/images/tutorials/beta-feedback/survey.mp4)

Expand Down
4 changes: 2 additions & 2 deletions contents/tutorials/feedback-interviews-site-apps.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ Next, go to the [settings page](https://us.posthog.com/settings/project-surveys)

## Creating your first feedback survey

Once you’ve set up your app to use surveys, you can create your first one to gather feedback. To do this, go to the [surveys tab](https://app.posthog.com/surveys) in your PostHog instance and click "New survey." Choose the [open feedback template](/templates/in-app-feedback-survey). In this example, we ask for feedback on an upload feature, so our question reflects this. We also want to target the `/upload` URL so we include that under "Targeting."
Once you’ve set up your app to use surveys, you can create your first one to gather feedback. To do this, go to the [surveys tab](https://app.posthog.com/surveys) in your PostHog instance and click "New survey." Choose the [open feedback template](/templates/in-app-feedback-survey). In this example, we ask for feedback on an upload feature, so our question reflects this. We also want to target the `/upload` URL so we include that under "Display conditions."

<ProductVideo
videoLight = {feedbackLight}
Expand All @@ -66,7 +66,7 @@ You can also use the surveys feature to show a prompt to users to book interview

To control who sees the prompt, we can use a feature flag. To create one, go to the [feature flags tab](https://app.posthog.com/feature_flags) and click "New feature flag." Add a key (like `user-interview`), release conditions like 100% of users where the country code is `GB`, and press save.

Next, go to the [surveys tab](https://app.posthog.com/surveys) and click "New survey." Use the user interview template. Add your booking link to the first question, and then under "Targeting," link your `user-interview` feature flag. Altogether, this might look like this:
Next, go to the [surveys tab](https://app.posthog.com/surveys) and click "New survey." Use the user interview template. Add your booking link to the first question, and then under "Display conditions", link your `user-interview` feature flag. Altogether, this might look like this:

<ProductVideo
videoLight = {interviewLight}
Expand Down
2 changes: 1 addition & 1 deletion contents/tutorials/framer-surveys.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ Create a survey in PostHog by going to the [surveys tab](https://app.posthog.com

![PostHog survey templates](https://res.cloudinary.com/dmukukwp6/image/upload/v1710055416/posthog.com/contents/images/tutorials/framer-surveys/survey-templates.png)

Next, customize your survey as needed. You can customize the questions, branding, and targeting. See our [survey docs](/docs/surveys/creating-surveys) for more details on how to do so.
Next, customize your survey as needed. You can customize the questions, branding, and display conditions. See our [survey docs](/docs/surveys/creating-surveys) for more details on how to do so.

Then, click "Save as draft" and then "Launch". Your survey is now live and you should see it on your website!

Expand Down
4 changes: 2 additions & 2 deletions contents/tutorials/nextjs-surveys.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ To create a survey with a prebuilt UI, go to the [surveys tab](https://app.posth
1. Add a name (like `my-first-survey`).
2. Set the display mode to `Popover`.
3. Select the `Rating` question type. Set the question title to `How likely are you to recommend us to a friend?`, display type to `number` and scale to `1-10`.
4. Leave the remaining optional properties blank (such as `Targeting` or `Thank you message`).
4. Leave the remaining optional properties blank (such as `Display conditions` or `Thank you message`).
5. Click "Save as draft" and then on the next screen click "Launch".

![Popover survey set up](https://res.cloudinary.com/dmukukwp6/image/upload/v1710055416/posthog.com/contents/images/tutorials/nextjs-surveys/create-popover-survey.png)
Expand Down Expand Up @@ -250,7 +250,7 @@ This shows a survey popup every time you visit your app's homepage.

#### 2. Fetch the survey from PostHog

PostHog keeps track of all active surveys for a user (this is especially helpful if you have set up [custom targeting options](/docs/surveys/creating-surveys#targeting)).
PostHog keeps track of all active surveys for a user (this is especially helpful if you have set up [custom display conditions](/docs/surveys/creating-surveys#display-conditions)).

To fetch the active surveys, we use the `usePostHog` hook to call `posthog.getActiveMatchingSurveys()` using `useEffect()`:

Expand Down
Loading

0 comments on commit 30102dc

Please sign in to comment.