Embedded Feedback

About Embedded Feedback

Whether you run a marketing blog, support documentation, developer resources, or another site, your content needs to be kept up to date. As a website grows in size, it can get harder to focus your improvement efforts. It’s also important to determine whether the content you’re producing is effective and measure its impact.

Embedded feedback makes it very easy to collect data on the content you run. You can embed a simple helpfulness question on your site content, so visitors can rate the content and even provide feedback right on the page.

Getting Started with Embedded Feedback

1. Open your Website / App Feedback project, or create a new one.
2. On the Intercepts tab, select Create new.
   
3. Select Embedded Feedback.
   

Customize the Content

When making an embedded feedback creative, the first section allows you to customize the content of the creative, including questions, button appearance, and so on. On the right side of the screen, the preview will update to match the settings you’ve added, and you can even click the buttons to test what the thank you message or follow-up question looks like.

1. Question: The question that will be displayed to website visitors. For example, “Was this helpful?” or “Please rate how helpful you found this content.”
   
2. Format: Either a Yes/No response or a 5 point rating.
3. Style: Choose what your buttons for the feedback should look like.
   • Yes/No: Either the words “Yes” and “No,” or thumbs up / thumbs down icons.
   • 5 point rating: Either emojis or stars.
4. Positive response option text / Negative response option text: If you chose “Yes/No,” you can modify what positive and negative word is used in your intercept. By default, this is “yes” and “no.”
5. Include a thank you message at the end: Once visitors click a rating, they’ll see the thank you message. Type this in the field.
   
   Qtip: If you include a follow-up question, this appears after the follow-up is answered.
   Qtip: You cannot reverse the order that the emojis appear, e.g., switch from increasingly positive to increasingly negative.
6. Include follow-up question: Based on how respondents answered the question, you can ask an additional question.
   • First, choose the answers that trigger this second question. You may select all or some of the answers, although we recommend targeting negative feedback.
   • Next, write your follow-up question.
7. Submit button text: If you’re including a follow-up question, determine the text of the submit button.

Look & Feel

The Look & Feel section allows you to adjust the layout, text weight, and colors of the creative.

• Layout: The orientation of the question vs. the answer choices.
  • Side by side
  • Stacked
• Text weight: The weight of the question text. Can be regular, bold, or italic.
• Text color: The color of the question text.
• Button customization: The colors you can change will depend on the format and style you chose earlier.
  • Yes/No: Change the color of the button text, button border, and the button fill.
  • Thumbs up/thumbs down: Change the color of the button’s outline (border) and fill.
  • Emojis: No customization – colors are preset.
  • Stars: Change the color of the star’s outline (border). This is also the color the star will fill up with when the respondent hovers over / selects that star.
• Submit button color: The submit button only appears if you’ve included a follow-up question; the submit button is how the visitor indicates they’re ready to submit feedback. This setting allows you to change its fill color.
  
• Submit button text color: Change the text color on the submit button.
• Customize CSS: Customize the CSS of the embedded feedback as desired. Edits made here will not be reflected in the preview; remember to test your intercept before deployment.
  
  Attention: The following code is provided as-is and requires programming knowledge to implement. Qualtrics Support does not offer assistance or consultation on custom coding. You can always try asking our community of dedicated users instead.

Qtip: If you would like to further customize the colors in your embedded feedback creative, you can use the color dropdown menus in the Look & Feel section.

Translations

You can add translations for all the text in your Embedded Feedback creative. See the Translating Feedback Buttons & Responsive Dialogs page for step-by-step instructions.

Determining Where Embedded Feedback Appears on a Page

Specify the location on your web page where you want your embedded feedback intercept to appear. You can do this by entering a CSS selector value that points to the element on the page that should contain the embedded feedback.

Deciding When the Embedded Feedback Appears

1. Click Add targeting logic to determine when your button or dialog should be displayed to respondents.
   
   Qtip: You can limit appearance based on a lot of different information, from cookies placed on the browser, to whether it has already been displayed to website visitors recently, to the URL of the page, and more. See the support pages listed under Action Set Logic for more information.
   Qtip: You can press Shift on your keyboard when clicking the plus sign ( + ) to create separate logic sets. For more details on building conditions, see Advanced Action Set Logic.
2.  When you’re done adding conditions, click Next.
   
3. Select your intercept display event. This setting determines when the intercept displays. For a description of each of the options, see the linked support page.
   
4. Set a Display sample rate.
5. Determine whether to add Repeated display prevention. If you do, you’ll be able to set the cookie off of which to base this. For more information, see the linked support page.
6. Click Show advanced options to see the “Hide when cookies are disabled” and “Hide when local storage is disabled,” which are selected by default. See the linked pages for more details on how these work.
   Qtip: Because the feedback is embedded right on the page and doesn’t impede the visitors’ ability to navigate or use a website, there is no reason to limit how often this intercept is seen, and in fact limiting it may be more confusing than not. We advise never hiding the embedded feedback, sampling 100% of visitors, not preventing repeated display, and displaying on page load.
7. When you’re finished, click Next.

Adding Extra Data Points

In this step, you will add extra data points that will be collected with the feedback data. This can vastly improve the detail you can include when reporting on content feedback.

1. Click Add Embedded Data.
   
2. Choose a value type. See the linked page for an explanation of each.
   
3. Click the plus sign ( + ) to add more fields.

We advise collecting the current page’s URL (so you can filter or organize data by the page receiving the feedback), the page title (for similar reasons), and duration of the visitor’s stay on the page.

Capturing the Page URL, Total Duration, and Page Title

• CurrentPageUrl set to a value of Current Page URL
• PageTitle set to a value from JavaScript
• TotalDuration set to Time Spent on Site

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.

This should return something like this:

#firstHeading

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

document.querySelector("#firstHeading").textContent

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

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

Testing the Intercept

Follow the steps on the page to save the bookmarklet and test your intercept. If you need to, you can open your website on another browser tab to test what the intercept will look like on your website.

When you’re done testing, click Next.

Deploying the Embedded Feedback on Your Website

You’ll be given a code snippet to share with your web developers.

Click Next.

Review your changes. If you want to edit anything before it goes live, click the pencil icon to go back to that step.

If you are ready for all changes to be live on the website that hosts the code snippet, click Publish and activate. If not, click Save and close.

Making Changes to an Embedded Feedback Intercept

From inside your Website / App Feedback project, you can find your Embedded Feedback in the Intercepts tab.

From there, you can click the pencil icon next to any of the sections to make edits.

“Preview intercept” in the upper-right will take you back to the options for testing your intercept. The Statistics tab will show you intercept statistics.

To deactivate the intercept, use the Activation toggle in the upper-right; this will keep your saved changes, but ensure they’re not active on your site.

Viewing and Analyzing Response Data

After your Embedded Feedback has been published, you’ll be able to report on or export data like any other survey project in Qualtrics.

Navigating to the Embedded Feedback Responses

When editing your embedded feedback intercept, click View survey responses. You’ll be taken directly to your reports.

You’ll notice you have access to the following tabs and capabilities:

• Actions Tab: Trigger different tasks inside Qualtrics based on survey results that come in. For example, create tickets for your writing team when visitors express discontent with content, or send an email to a manager whenever you receive highly positive feedback.
• Data & Analysis Tab: Filter responses you’ve collected, export responses, conduct text analytics, edit or remove responses, and more.
• Reports Tab: Where you land by default. Use two different reporting features to visualize your results.

You cannot edit the questions or appearance of this survey; edit the embedded feedback intercept directly to adjust customization as needed.

Reporting on Data

You can view and analyze this data the same way you would any other survey. Here are some ideas to get you started.

• Exporting Response Data
• Filtering Response Data
• Advanced-Reports Basic Overview
• Results-Reports Basic Overview
• Getting Started with CX Dashboards
  Qtip: When adding this data as a source to a dashboard, it’ll appear under surveys, and will have the same name as the embedded feedback intercept, but with “- Survey” added at the end.