After installing Wondering on your web application, you can now target users that visit any page where the snippet is loaded for your studies. To instead target specific actions with your studies, you can use triggers. A trigger is the action that prompts the Wondering widget to be displayed to a user if they are eligible for the study.

Page URL vs Code triggers

There are two types of triggers, Page URL triggers and Code triggers.

Page URL triggers allow you to target specific URLs in web applications using a regex expression, and doesn't require any further additions to your web applications code.

Code triggers are added to your web application's code and allow you to target actions whenever the trigger is invoked.

Page URL Triggers

Page URL triggers can be defined as text to match URLs your users visit in your web application. To create a page URL trigger, click Add Trigger on the Triggers tab (inside Integrations) - here you will be able to name your trigger, and select a rule from the following options:

• Contains - this means that the matching text you choose needs to be contained in the URL for the trigger to fire.
• Regex match - this allows you to create a regular expression (regex) matching string. This regex is ran against the visitors URL.
• Starts with - this fires the trigger if the URL of the visitor starts with the matching string given.
• Ends with - this fires the trigger if the URL of the visitor ends with the matching string given.

You can test the above rules and your matching text during the creation of the trigger.
Once implemented, if you start a call with the trigger selected, you should see the widget appear when your trigger is activated.

Code triggers

Code triggers are declared in your web application's code. To create a trigger you need to:

1. Add the trigger from the Events page If you are an enterprise user, you can skip this step.
2. Invoke the trigger in your code by calling the Wondering function:

window.wondering("trigger", "NAME_OF_YOUR_TRIGGER");

Replace NAME_OF_YOUR_TRIGGER with the name you've chosen for the trigger, which you can configure on the Events page in your Wondering account.

Users will only be invited to join a user interview after you've started a user interview and until one user has joined your interview or you manually stop the interview.

Example - Setting up a code trigger on a web application that is using React.js

📘

The implementation below requires access to the code, and some understanding of the React framework.

If you are using react, so long as you have the script in the header of your app you will be able to call triggers within your app.

Trigger on component load

To trigger on component load, add a useEffect in the component:

useEffect(() => {
    window.wondering('trigger', 'trigger-name')
}, [])

This will trigger on component load. You can use this functionality to trigger the Wondering widget in any situation, for example if you want to show the Wondering widget on a modal opening or a specific part of the component being used.

📘

If a user calls one or multiple triggers within the same page load, they will only be able to see the widget once.

Once implemented, if you start a call with the trigger selected, you should see the widget appear when your trigger is activated.