Set up the UserVoice Widget

 photo TTScreenshot_zps976646de.png
You're ready to set up the UserVoice Widget, but need to know how. You also want to understand all your different options for customizing the widget. No worries, we'll walk you through it!


The UserVoice Widget has different features. We'll walk you through setting up each and your different customization options. We'll cover...
The UserVoice widget does not work with Single Sign On (since it does not authenticate users) or Private Forums.

Basic Settings for the UserVoice Widget


Back to the top

Click the icon in the bottom left corner [If you’re on an old version of UV, your settings will be accessed from the admin header.]
Choose "Widgets" from the drop down menu. 

Step One: Customize Your Widget Design

  • Starting Experience: When the user clicks the trigger (the icon that opens the widget), what do you want them to see by default.
  • Trigger Position: The trigger the user clicks to open the widget, where do you want it located—bottom right, bottom left, top right, or top left?
  • Accent Color: You can set the color of the accents on the widget
  • Trigger Color: Set the color of the trigger that opens the widget. 
I want to use a color not listed in the widget settings: You can! You can actually edit the widget code to use whatever colors you would like. Here's where you would update it in the code.
// Set colors
UserVoice.push(['set', {
  accent_color: '#448dd6',
  trigger_color: 'white',
  trigger_background_color: 'rgba(46, 49, 51, 0.6)'
}]);

Step Two: Copy the embed code to your page


Once you've chosen your settings, copy the code in step two and add it to your website. This code is unique to the settings you just chose. If you decide to go back later and update your Widget design, you will need to create a "new" widget or edit the code already added to your website.

Triggers


Triggers are what you use to open the widget. The default trigger is a question mark chat bubble. A user clicks the "trigger," and it opens the widget. If you choose the SmartVote or NPS widget as your starting experience, the trigger will be their default icons—a heart chat bubble for NPS or a lightbulb chat bubble for SmartVote.

You can customize the colors, but the icons cannot be changed. However, you can use your own custom trigger. This article will walk you through how.

That gives you an overview of your basic setting options. Now we're going to dig into the different widgets, how they work and advanced customization options. 

Post Idea Form


Back to the top


Create suggestions

The post idea form allows users to create suggestions. You can point the post idea form to a particular forum with the forum_id parameter in your javascript embed code (optional), and this is the forum that suggestions will be created in. Otherwise, suggestions will be created in your default forum.

Instant Answers

With the post idea form experience the user enters a message and clicks "Next." We will then show them any ideas that match keywords in their message. The goal is to help the user find existing suggestions in your forum. Instant Answers cannot be turned off.

If an existing suggestion is returned, the user will be presented options to support an existing idea.

Attachments

Users have the ability to add attachments to suggestions they create with this widget.

SmartVote


Back to the top
 photo 2013-09-11_1522_zpse1c9c124.png
The user is presented with a set of two ideas. They can then "pick" one or "skip" the set. Our User Feedback report then shows you the wins and losses of each idea, so you can see how ideas on your forum stack up against each other and which ideas really are the most important to your user base. 

In SmartVote, users will also see a link "Or, post your own idea" which will allow them to create their own idea if they want. 

Reference this article for more details about using the SmartVote widget: link

NPS Widget


Back to the top
 photo 1Satisfaction_zps49f988e6.png
The user is asked, “How likely would you be to recommend {organization name} to a friend or colleague?” They can choose a score between 0—10.

Promoters: Users who gave you a score of 9 or 10. 
Passives: Users who gave you a score between 7-8.
Detractors: Users who gave you a score between 0-6. 


Organization's Name
  • The {organizations name} is pulled from the one listed in Settings -> Account and Billing -> "Organizations Name and Website." 

  • The NPS Question Cannot be Customized
  • This is because the rating and report are based on a very specific question and answer.  It is also based on your entire UserVoice account, so it can't be customized to a specific forum. 

  • NPS Tweets and Follow-up
  • When a user gives you a 9 or 10, you can customize their experience. You can simply thank them for their feedback or encourage them to tweet about it. Go to Settings -> Widgets -> Scroll down and click "NPS Tweet and follow-up." Select the option you want.

  • Auto-Prompt for NPS
  • With auto-prompts, the NPS widget is shown after 60 days of activity and every 60 days after that. If you don't want to use auto-prompts for NPS, you can turn it off in Settings -> Widgets -> Scroll down to "Autoprompts" and click "Edit." Uncheck the box for "NPS."  Want to learn more about how auto-prompts work? Check out our developer doc here.

  • NPS Report 
  • Click on "Analytics" in the left hand menu -> Click "User Satisfaction" to see a report built around your users's responses to the Satisfaction widget. 


  • Also, when viewing a user in Inspector, you will see dots next to their username. Three green mean they are a promoter. Two yellow, they are passive, and one red they are a detractor.

  • User Traits


    Back to the top
    You can pass user and even account traits through for your users, even if they don't engage with the widget. The data will show in Inspector on the right and is specific to the user (vs. specific to a ticket like ticket fields). Our developer article here walks you through how to identify users and pass traits through the widget. 

    Advanced Customization


    Back to the top
    We've walked through your basic customization options but maybe you want to do more!  You might want to turn off the NPS widget, make SmartVote default to create an idea, change the height of the widget etc... Our developer documentation here walks you through all your advanced customization options. 

    Feedback and Knowledge Base