It is possible to trigger a survey using an existing button or link on the page. To do this, some changes have to be made to the HTML of the page. Additionally, for this survey, you need to set some specific settings in the deployment screen and in the form builder.

The steps

The following steps need to be executed to use your own button or link to trigger a survey.

Update HTML on page

To use your own button or link on a page to trigger a Mopinion survey, this button or link element has to be added to the page and it should call a method provided by the Mopinion survey script: srv.

The srv object

When your page loads and the Mopinion deployment script finds that all conditions set in the deployment editor for your survey are met, then the srv object becomes available on the page. This object contains a number of methods that can be used to execute specific behavior for your survey. The method we are want to use to open a survey with a button is srv.openModal.

Open the form with your own button

To open/show the form with your own button or link you can use: 

This JavaScript function can be added as an on-click event, for example. 

You can add this code to your button:

You need to specify it with the form key, which is the unique identifier for that particular feedback form.

Get the form key

You can find that key on the Feedback forms page. Click on the icon with the three dots, and click on Copy form key.

Open

Open

For example, if the form key is 2a8f783514fa91e03666bbb8c444ac4a0b967074, then the full code for a link or button would be:

To check if it works you can also run the command from the browser console (right-click: Inspect element and enter the JavaScript function without the HTML tags, so remove <a> and ‘onclick’ event). Like this:

Set the deployment conditions for this survey

Use the correct trigger conditions

For a survey that you want to trigger using a button or link, the trigger condition needs to be set to Triggered by Button.

Set and add specific form settings and styling

Set display type

In the form editor set the display type for the survey to either Modal or Slide-in.

Then we need to hide the Mopinion button. Because we need to use the Trigger by button deployment condition, a button will show at the side of the screen when the survey loads. We want to hide this default Feedback button because we want to use our own link or button.

Hide the Mopinion button

In the feedback form editor, go to the Design tab, in the sidebar, click on Form and then scroll down to custom CSS. 

Here you add one of the following lines, depending on the display type. Be sure to replace form-key with the identifier of your particular feedback form. To find the form-key see this article: Where can I find the form-key.

Modal

Slide-in

Video walkthrough

And that's it... You are good to go!