Online reviews continue to play a huge role in consumer trust for companies. It is becoming increasingly important for companies to engage with their customers and gain feedback. It seems like a small request, but giving feedback is usually a commitment customers aren’t willing to take. To make it as simple as possible, we can set up an email and a landing page with a little javascript to gain reviews in only one click.
To create the hover effect on our stars, some css was involved:
.ratings td {
background-color: #7dcdd4; /*The blue background color of the email*/
}
/* previous stars should be white */
.ratings:hover td {
background-color: #FFFFFF; /* Change the background color to white, which colors in the star */
transition: .4s; /* This fades the color in and out on hover */
}
/****
The above css will turn all stars to white.
In order to display an accurate rating, we use css
to keep stars blue when they're after the one selected
*****/
.ratings td:hover ~ td {
background-color: #7dcdd4;
transition: .4s;
}
There’s a combination of hover effects and png transparency here. This shows how the transparency is set up on the image:
Note that these hover effects will not work in some inboxes, which includes most Outlook renderings. The functionality to actually get reviews is still there, though, so you just lose some of the flashiness!
Getting the rating
To get the rating, each star is linked to a single landing page (created within the emfluence Marketing Platform), but has a 1-5 value in a query string (the ?rating=1 at the end of the url).
<a href="https://more.emfluence.com/auto-submit?rating=1" target="_blank">
<img border="0" class="rating" width="75" height="54" src="http://emfl.us/fG7d"/>
</a>
Clicking on each link sends this value, along with the contact data, to the landing page, where we use the below javascript to add it to a form value on the page:
function GetURLParameter(sParam)
{
var sPageURL = window.location.search.substring(1);
var sURLVariables = sPageURL.split('&');
for (var i = 0; i < sURLVariables.length; i++)
{
var sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] == sParam)
{
return sParameterName[1];
}
}
}
//select rating based on url
var rating= GetURLParameter('rating');
$(document).ready(function() {
$('#rating').val(rating);
});
We then use another line of javascript to submit the form automatically, since we have all the data and don’t require user interaction. We have now collected the user’s rating!
Get feedback along with the rating
If a customer gives you a 1 star rating, you’re going to want to hear from them so you can identify the problem. For this reason, we have our automatically-submitted form redirect to an additional form where more information can be given, then appended to the rating.
Don’t forget to follow up!
We have made it as easy as possible to get customer feedback, so hopefully ended up with some! Be sure to follow up and reach out to any negative reviewers, as well as celebrate the positive reviews!
Want more tips like this in your inbox? Be sure to subscribe to our monthly newsletters on Email Tips and the latest trends in email and marketing automation strategy: https://more.emfluence.com/subscriptions
