Ratings

Follow

Ratings is a plugin which helps collect, store, search and track user feedback from web and mobile applications. It pops up as a widget that triggers the collection of data so that you can obtain feedback from users.

image3.png

Creating your Ratings widget

As a first step, you need to create a widget to collect user ratings. Click the Ratings Widgets tab in order to access the popup editing screen.

There is a green button at the top right corner to open the widget creator dialog.

 

How can I find this screen?

To find this screen, go to Reach>Feedback>Ratings. You will see the Ratings Widget tab on the top menu. To create a new Ratings widget, click on the green button “Add New Ratings Widget”.

image6.png

The creation process consists of three steps: Popup appearance, Trigger button appearance, and Devices and Targeting.

 

Popup appearance

This section contains inputs for the Ratings plugin popup appearance like Title of popup, Labels of checkboxes, Title of submit button, and Thank you message values. If you leave these fields empty, those values are set by default.

Also you can hide Add comment and Contact me via email sections by using checkboxes on drawer.

image5.png

Trigger button appearance

image7.png

This section contains inputs for properties of the trigger button. You can customize the position of trigger button, background and font color, and trigger button text. You can also customize the trigger button size - you have three options: Small, Medium, and Large.

For some use cases which require manual popup call, there is an option called Hide sticker. If you check this option, the popup trigger button won't be seen on the page, even if you integrate Ratings on your site. Instead, you need to call Ratings popup manually through the show_feedback_popup(widget_id) method. There are sample use cases for this in the Integration section, below.

Devices and Targeting

image4.png

You can easily enable or disable Ratings popup for some devices (e.g desktop, tablet or phone) during this step. Also, you can define target pages for which the Ratings popup will be shown.

You can define exact target pages like /products/our-great-product or use /products/* for all pages under the /products/ path.

By default, Ratings popups are disabled. If you want to enable them, just click on Set Ratings Active checkbox. You may also change Ratings popup state after you create it as well.

After this step, your Ratings popup is ready to be shown to your users.

After creating the popup, a helper page for the web integration will appear. You just need to copy the highlighted line and paste it into your html file, inside the Countly SDK. For details, please check the Integration step below.

Edit popup

All Ratings popups are listed in a table. If you want to change any configuration about Ratings popups, you just need to click ‘Edit popup’ menu item, as seen below.

image1.png

When you click on ‘Edit popup’ in the menu, a drawer will appear, as shown below.

image2.png

As you see above, all inputs on every step are already filled with current values of popup. You can easily change those values and update popup as required.

Removing a popup

When you don't need a Ratings popup anymore, you just need to click on ‘Delete popup’ under the menu at the right corner of the corresponding row.

When you delete the popup, all comments will be removed, so proceed with caution.

Integration

When your popup creation process is done, you need to integrate this popup into your application. Ratings plugin can support mobile and web applications, hence we will talk about how to do both integrations below.

Web Integration

To integrate Ratings to your web application, you first need Countly to integrate web SDK. If Countly web SDK is already initialized on your web application, you just need to integrate one line below (check the line starting with "ATTENTION").

/* ATTENTION PLEASE! */
Countly.q.push(['enable_feedback',{'popups':['5b86772f7965c435319c79ee']}]);
/* THANKS FOR YOUR ATTENTION! :) */

Then your Countly Web SDK integration code section looks like below.

<script type="text/javascript">
  // Some default pre init
  var Countly = Countly || {};
  Countly.q = Countly.q || [];
  // Provide your app key that you retrieved from Countly dashboard
  Countly.app_key = "1234426e50d669e5035d618cbff9374982065223";
  // Provide your server IP or name. Use try.count.ly for EE trial server.
  // If you use your own server, make sure you have https enabled if you use
  // https below.
   Countly.url = "https://your.countly.instance"; 

  // Your Other Countly feature pushes to Countly.q array
  // Countly.q.push(['track_session']);
  // Countly.q.push(['track_pageview']);
  
  /* ATTENTION PLEASE! */
Countly.q.push(['enable_feedback',{'popups':['5b86772f7965c435319c79ee']}]);
/* THANKS FOR YOUR ATTENTION! :) */


// Load countly script asynchronously
(function() {
var cly = document.createElement('script'); cly.type = 'text/javascript';
cly.async = true;
// Enter url of script here (see below for other option)
cly.src = '/countly.js';
cly.onload = function(){Countly.init()};
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(cly, s);
})();
</script>

That's all. You're ready to use the Ratings plugin. Please make sure you enable the Ratings popup status on the dashboard.

Multiple popup

In some cases you may want to use multiple popups in one page. In this case your only need is to add popup id values into the popups array. For example, see the code below.

/* ATTENTION PLEASE! */
Countly.q.push(['enable_feedback',{'popups':['5b86772f7965c435319c79ee','5b86772f7965c435319c79fe','4b86772f7965c435319c79ee']}]);
/* THANKS FOR YOUR ATTENTION! :) */

As you see above, you can add multiple popups into one page with the array type 'popups' parameter of ‘enable feedback function’.

Manually calling a popup

You may need to trigger a popup manually because of some reason. If you need to trigger a popup manually, you should check the ‘Hide sticker’ option on the ‘Trigger appearance’ step of the creation process.

After this configuration, you just need to call popup as follows:

 

var go = confirm("Do you want to continue?");

if (go) {
  // you can get popup id easily through the ‘Copy Popup Id’ option in the popup menu.
show_feedback_popup("5b890791dfc7d9562b391df8")
}

Mobile integration

When you use Ratings plugin for mobile applications, you have two options:

Using native dialogs: In this case, native dialogs have the ability to show 1-5 star ratings only.

Using web dialogs: In this case, web dialogs called from native iOS/Android apps can show avatars (faces) that help retrieve end users’ feelings (e.g from very satisfied to very disappointed). This is the same as how web integration works.

The first case won't retrieve comments but only 1-5 star ratings, whereas the second option will be able to show an option to retrieve comments and email of the end user.

For iOS integration you can take a look at the iOS SDK documentation. For Android integration, please check Android SDK documentation.

 

Tip: Difference between the Ratings, Surveys, and NPS plugins: they are all Feedback plugins, but they address different customer experience aspects: 

  • Ratings can be added to any page and incorporate a scale of emojis to answer a very straightforward customer satisfaction question. Their segmentation is based on the user’s device and the page they view.
  • Surveys run based on behavioral or property segmentation, providing flexibility to customize up to 5 questions and to customize target segmentation.
  • NPS is triggered when users/customers perform an event and has a very standardized calculation method.

 

Was this article helpful?
0 out of 0 found this helpful

Looking for help?