Skip to main content
  • Customer Experience
    Customer Experience
  • Employee Experience
    Employee Experience
  • Brand Experience
    Brand Experience
  • Product Experience
    Product Experience
  • Core XM
    Core XM
  • Design XM
    Design XM

Tracking Content Helpfulness

What's on This Page:

Was this helpful?

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

The feedback you submit here is used only to help improve this page.

That’s great! Thank you for your feedback!

Thank you for your feedback!

About Tracking Content Helpfulness

You have content on your site to help your visitors find answers to their questions. How do you know that your visitors have actually achieved their goal? How do you know whether the content was helpful, or could use improvement?

On this page, we’ll explain how to use Website / App Feedback to measure the helpfulness of a page, all without disrupting the visitors’ flow. We will be using a Wikipedia page as an example.

On a wikipedia page, in the Sales Experience section, there's a little question on the page asking if the section was helpful, with little yes and no buttons you can click

Survey Setup

Let’s start with the survey.

  1. Make a survey project.
  2. Create a new multiple choice question titled “Was this helpful?” with “yes” and “no” as answers.
    Qtip: Do not add “maybe” or “I don’t know” as options. This will make the data you collect subjective and difficult to action.
  3. Add a new block.
  4. In the new block, create a text entry question titled “How can we improve this page?”
  5. Add display logic to the text entry question so it will only appear if the user answers “No” to “Was this helpful?”
  6. This is what your survey should look like, so far:
    Survey appears as described: first block has the helpfulness question. Second block of the survey has a clarification "more feedback?" question with a display logic on it
  7. Now, go to the Survey Flow.
  8. Add an Embedded Data element.
    Embedded Data element at the top of a survey flow with the listed fields inside it
  9. Add the following Embedded Data so you can track the page the visitor’s on, the name of the page, and how long they spent on the page:
    • CurrentPageUrl
    • PageTitle
      Attention: The PageTitle field will require some programming knowledge to implement. We recommend passing this information to the team that will be implementing your deployment code. Our support team does not offer assistance or consultation on custom coding. You can always try asking our community of dedicated users If you’d like to know more about our custom coding services you can commission, please contact your Qualtrics Account Executive.
    • TotalDuration
      Qtip: Do not use Q_TotalDuration; this is a different, pre-built field. Just type TotalDuration.
  10. Move the Embedded Data to the top of the Survey Flow.
  11. Save the Survey Flow.

Look & Feel

In addition to the survey customization we’ve described so far, you’ll also want to consider the following Look & Feel settings for your survey:

Look & Feel button in toolbar, top of survey

  • Use the Classic layout: Reduce spacing between questions and answers.
  • Use the Blank survey theme: Keep the survey plain so it blends right into your webpage.
  • Use Autoadvance on Questions and Autoadvance on Pages motion: After the respondent answers the helpfulness question, the survey will automatically progress to the next question (or submit, if they don’t qualify for the hidden question). This also contributes to the seamless experience of embedding the survey on the page.
  • Use Compact Question Spacing: Make sure the space around questions is smaller to reduce the space the survey takes up on the page.

Website Feedback Setup

Now that we have our survey, let’s set up our Website / App Feedback project.

  1. Create a Website / App Feedback project.
  2. Under the Creatives tab, make a Custom HTML.
  3. Add an Embedded Target to your Custom HTML.
    Creative editing screen. An Embedded Target, which looks like a white box that has text inside saying the intercept's target will appear there
  4. Resize the target. You’ll want it to be big enough to fit one survey question at a time, but small enough to take up little room on the page.
  5. Under the Intercepts tab, create a new intercept.
    Intercept with the Custom HTML project under the creative to show, and the helpfulness pulse as the Qualtrics survey selected
  6. Connect it to your Custom HTML creative.
  7. Connect it to your survey.

Capturing the Page URL, Total Duration, and Page Title

Add your Survey Flow’s Embedded Data to the Intercept:

Embedded Data in an intercept, as listed

  • CurrentPageUrl set to a value of Current Page URL
  • PageTitle set to a value from JavaScript
  • TotalDuration set to Time Spent on Site
Qtip: Make sure you spell this fields exactly as they appear in the Survey Flow! Do not introduce different spacing to them – Page Title will not capture PageTitle.

For PageTitle, we need to set the value from JavaScript so we can capture your web page’s title. But how?

If you are using Google Chrome, simply select the title on the page, right click, and select the Inspect option. The Chrome developer tools window will open up, and it should look like the following. Right click on the corresponding HTML element and copy the selector, as shown below.

Wikipedia pag right-clicked, with console appearing as described

This should return something like this:


With the following JavaScript, you can get the value of the page title from the HTML element:


You can edit the bolded text, depending on what your selector returned.

Qtip: You can test this out in the Chrome Developer Tools console to see what the value looks like.

Chrome developer tools. Console selected. Throw in the Javascript we provide, and it returns a value in red, the name of the wikipedia page

Now that we have the JavaScript, put it in the value for the Embedded Data field “PageTitle,” as shown earlier. Click Save on your Embedded Data when you’re done.

Placing the intercept in the correct spot on the page

We’re almost done. Finally, we want to decide where to show the “Was this helpful?” question.

  1. Say we want to add it right above the “See also” section on the Wikipedia page. Again, we can go back to our Google Chrome developer tools to find out the Id of the element where we want to insert the Custom HTML creative. It turns out the Id is “See_also”.
    Developer tools
  2. Copy this.
  3. Go to Advanced Options.
    Advanced Options page
  4. Under Display Options, select Replace Creative Contents.
  5. Under Creative Insertion Point, paste the selector, e.g., See_also.
  6. Click Save.
  7. Go to Intercept Options and make sure we insert before the target container. This ensures the survey appears before the See Also section, as we decided earlier.
    Options tab of an intercept

Testing the Intercept Before Publishing It

Using a bookmarklet, we can test out our intercept on the page. This section will go over some of the common changes you may want to make to an intercept as you test implementing it on your page.

Button Placement

Wikipedia page, with the yes visible but no No button

In the screenshot above, both answers don’t fit on the page. We want the yes and no buttons to show side by side. Go back to the survey question and change the multiple choice Position to Horizontal or Column.

Position option on a multiple choice question

Button Size

Sometimes, buttons may appear larger than we want them to. Here are some Look & Feel edits that can adjust button size:

  • Change the layout
  • Change the font size of the answers

However, the best way to reduce button size is using Custom CSS in the Look & Feel editor.

Attention: Our support team does not offer assistance or consultation on custom coding. You can always try asking our community of dedicated users instead. If you’d like to know more about our custom coding services you can commission, please contact your Qualtrics Account Executive.