Setup 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!

[Note:If you are looking for our Classic Widget, check out this handy article]


The UserVoice Widget has three different features. We'll walk you through setting up each and your different customization options. We'll cover...

Basic Settings for the UserVoice Widget


Back to the top
Click on "Settings" in 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—The Contact form, SmartVote, or the Satisfaction? The default is the contact form.
  • 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 Satisfaction widget as your starting experience, the trigger will be their default icons—a heart chat bubble for Satisfaction 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. 

Contact Form


Back to the top
 photo TTScreenshot_zps976646de.png
Instant Answers

With the contact form experience the user creates an idea and clicks "Next." We will then show them any ideas or articles that match keywords in their message. The goal is to help the user find their own answer to their question. Instant Answers cannot be turned off.




Screenshots


When submitting a ticket through the Contact Form, the user can opt to include a screenshot.
  • We use a tool that renders the page's markup and generates a screenshot. Flash, images, SVG charts/images, and videos won't show in the screenshot. 
  • You can disable it with screenshot_enabled: false.  Learn more here.
  • Supported Browsers: IE10+, Chrome, Safari, Firefox.
Customize the Title of the Contact Form View
  •  You can customize the text "Send us a message" with contact_title in the code. Learn more here
Can the placeholder text be customized? Not at this time.

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. 






Which ideas are displayed?

  • By Status: By default, all ideas with an "open" status are included in SmartVote. You can limit this to only ideas with a specific status like "Gathering Feedback." Click on "Settings" in the Admin Header -> Choose "General" from the drop down menu -> Scroll down and click "Feedback" -> Click "Statuses" -> Check the statuses you want included. Ideas with a "Closed" status cannot be used with SmartVote at this time. 
  • Categories: You can also set it so that ideas for SmartVote are only pulled from certain categories. You set the category in the code with smartvote_category_ids.  Learn more here.
Choosing which Forum it points to 
  • SmartVote will point to your default forum. However, you can set it to point to a different forum in the code with forum_idLearn more here.
Customize the Title of the SmartVote Widget View
  • You can customize the text "What should we add next" with smartvote_title in the code. Learn more here.
Auto-prompt Users for Feedback 
  • SmartVote will prompt the user for Feedback after 7 days of activity and every 30 days after that. If you don't want to auto-prompt the user, you can turn it off by going to Settings -> Widgets -> Scroll down to "Autoprompts" and click edit. Uncheck the option for SmartVote.  This setting will be applied to all your widgets (so globally). You can also turn it off per widget. This article walks you through different options for auto-prompts. However, if you use auto-prompts, you can't customize how often user's are prompted for feedback.
User Feedback Report 
  • Click on "Analytics" in the left hand menu -> Click "User Feedback" to see and segment the data gathered by SmartVote. Learn more about the report here
SmartVote does not work with Single Sign On (since it does not authenticate users) or Private Forums. If you are interested in a widget with those features, check out our Classic Widget.

Satisfaction Rating 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 Satisfaction Rating 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. 

  • Satisfaction 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 "Satisfaction Tweet and follow-up." Select the option you want.

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

  • Satisfaction Rating 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. Learn more about the report and what it tells you here


  • 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 custom 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 Get Satisfaction 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. 

    Other Articles You Might Find Helpful:

    Feedback and Knowledge Base