Skip to main content

Hi!
 

We’d love to have a quick question or two for those who unsubscribe from our email list(s). Just something to help us learn about why they unsubscribed. I’ve searched all over and I can’t figure out how to do this.

Does anyone know if it’s possible to have an automated survey appear after someone unsubscribes?

Hi @Kyle,

 

Once a user has unsubscribed, you will no longer be able to email non transactional marketing content to them from the Klaviyo platform. Unsubscribed users are only eligible to receive transactional emails once they’ve been suppressed due to the nature of these messages. Once a user has unsubscribed they will remain suppressed in the Klaviyo platform until the time comes when they reopt-in .

 

You do have a few alternative options for how to engage with these suppressed/unsubscribed users:

  • You can create a segment of your recently unsubscribed users and target a signup form to this population so if they come back to your website, you can ask them to complete a survey.
  • You can leverage Klaviyo’s integration with facebook to target these unsubscribed users with tailored messaging.

 

I hope this helps!

Julie


Thanks, Julie!

Sorry, I wasn’t planning on emailing unsubscribers a survey. I guess “survey” isn’t really the right word for it. Just a question when they opt-out.

I was thinking more along the lines of a one-question tag-on (maybe to the unsubscribe confirmation page?) that asks something like, “Please tell us why you no longer wish to receive emails from us” and then has like 5 reasons: “I did not sign up to receive these emails; I’m no longer interested; The content isn’t relevant to me;” etc. etc. It’s a pretty common/standard thing we’ve all seen a lot after unsubscribing from a list. We just need something to indicate why people opt-out. Does Klaviyo offer something like that?

 


Hey @Kyle,

That is a great idea to learn more about your contacts! Most importantly, it certainly is possible! 

@julie.accardo gave some great options by using the default functionality of Klaviyo to gather this information; but you can also accomplish your goal and suggestion by utilizing and Custom Coding your own Unsubscribe/Manage Preference page using HTML/CSS. As part of your custom Unsubscribe page, you can include this field of “Please tell us why you no longer wish to receive emails from us” and their selection of reasons as to why they are unsubscribing; that when selecting one of these options and unsubscribing would tag these contacts with a Custom Profile Property.

 

With these customers tagged with this custom profile property such as “Unsubscribe Reason”, you can then create a segment of these users who has this profile property using the rule of “Properties about someone, Unsubscribe Reason (or whatever the name if your custom profile property being passed is) is Set” and Export this Segment while including this profile property field as part of the export; would allow you to analyze these reasons as to why your contacts decided to unsubscribe via a .CSV.

 

-David


Got it. I’ll definitely look into that option. Thank you, David.


Hey @Kyle,

That is a great idea to learn more about your contacts! Most importantly, it certainly is possible! 

@julie.accardo gave some great options by using the default functionality of Klaviyo to gather this information; but you can also accomplish your goal and suggestion by utilizing and Custom Coding your own Unsubscribe/Manage Preference page using HTML/CSS. As part of your custom Unsubscribe page, you can include this field of “Please tell us why you no longer wish to receive emails from us” and their selection of reasons as to why they are unsubscribing; that when selecting one of these options and unsubscribing would tag these contacts with a Custom Profile Property.

 

With these customers tagged with this custom profile property such as “Unsubscribe Reason”, you can then create a segment of these users who has this profile property using the rule of “Properties about someone, Unsubscribe Reason (or whatever the name if your custom profile property being passed is) is Set” and Export this Segment while including this profile property field as part of the export; would allow you to analyze these reasons as to why your contacts decided to unsubscribe via a .CSV.

 

-David

Hey, 

I have followed the instructions above, and everything is running fine.

Only problem is that I can’t get my custom profile property to update properly once a user is unsubscribed.

I have added a custom page as described here: https://help.klaviyo.com/hc/en-us/articles/115005077067-How-to-Custom-Code-an-Unsubscribe-or-Manage-Preferences-Page

 

Then I have set a custom profile property as a hidden input when users subscribe. I have tried both with $ and without. Then on my custom page I have set that custom property to be submitted, BUT it isnt working, meaning something is missing.

I can paste my code here if it helps.

I tried with chat support but they werent very helpful.

Thanks


I’m having the same problem as @coljung , followed all the steps to add custom fields but they are created/updates ONLY when the user is updating preferences, NOT when checks the unsubscribe checkbox.

I also tested using the EXAMPLE HTML in the custom page documentation, here:

https://help.klaviyo.com/hc/en-us/articles/115005077067-How-to-Custom-Code-an-Unsubscribe-or-Manage-Preferences-Page

and EmailFrequency and EmailInterests are only updated when I DO NOT check “unsubscribe me”. Any way to avoid this? What I need is to let the user unsubscribe and provide reasons why.. (so be able to store custom fields even when the user is unsubscribing)

Am I missing something?


Hi there @Maxine and @coljung,

Wanted to see if I can offer some general guidance around getting this to work. The endpoint for unsubscribing, unlike the endpoint for update preferences and subscribe, does not take in the parameter for $fields so you cannot set custom properties for a profile when trying to unsubscribe. These must be two separate actions. First send the information for their unsubscribe reason, and then send the unsubscribe event. Sending the information first will ensure their profile is updated with the unsubscribe reason before they are unsubscribed overall. You can try using our Identify API to set the profile property before the form submission. We have a guide here that you can reference. In addition, you can include a manage preferences link in your unsubscribe page and style it with a question like, “tell us why you’re unsubscribing” and then lead customers to a manage preferences page that would work.

 

If you are using Shopify:

When someone unsubscribes within Klaviyo, it will not affect their profile in Shopify, regardless of whether you have the option to sync data back to Shopify enabled. The Accepts Marketing property in Shopify does not affect someone's status within Klaviyo, and when they become suppressed in your Klaviyo account, we do not pass that data back to Shopify. There is a manual workaround, if you want this data to sync.
You would need to update the Accepts Marketing property in Klaviyo to False when someone unsubscribes and then have that data sync back through the Update Shopify profiles with Klaviyo data functionality. 
To achieve this, first create a segment that pulls in profiles that are suppressed:
?name=inline-1304234131.png

You would then need to make a flow that triggers off of this segment. When a profile joins the segment they will then trigger the flow. In the flow, you would need to use the Add an Update Profile Property Action to a Flow functionality to update the profile property Accepts Marketing to False:

?name=inline955148004.png

Once you update this property in Klaviyo, it should sync back through the integration and update your profiles back in Shopify.

Please let me know if that helped a bit. Would love to hear other Community members ideas if they had similar problems.

Alex


After a lot of trial and error I finally got this to work!! Like with @Maxine and @coljung (assuming you had a similar problem too, @Kyle), when I created the custom unsubscribe page, and added a list of reasons to select why they are unsubscribing, the custom profile property would not update once a user unsubscribed.

Therefore, the user would unsubscribe, but the unsubscribe reason would not post to their account as a custom profile property.

I used a lot of trial and error to come to the conclusion to treat the page with the idea of a multi-submit form -- but then actually splitting the two sections (unsubscribe reason selection and unsubscribe checkbox) into two separate forms, where upon submitting the first form reveals the second. Because of this, the unsubscribe reason selection must come first. tNOTE: I used Klaviyo’s base code for custom unsubscribe page, found here: https://help.klaviyo.com/hc/en-us/articles/115005077067-How-to-Custom-Code-an-Unsubscribe-or-Manage-Preferences-Page ]:

  • Add the unsubscribe reason selection in one <form> and the actual unsubscribe checkbox in a separate <form>; Note: both forms will need the email field (I just changed the label for the second one to “Confirm email address”)
  • The unsub reason form will have to come first
  • After the unsub reason form, put in a hidden iframe:
<iframe name='formresponse' width='300' height='200' style="display:none"></frame>
  • The unsub reason form then needs to have a target of the iframe, so add target=”formresponse” to your unsub reason form
  • To make it extra user-friendly, I also added an onclick to the unsub reason form button so that onclick it would hide the unsub reason form (put it in a div, used javascript function to hide on click), as well as to reveal the unsubscribe checkbox form (so it’s hidden until they submit their unsubscribe reason) (put the unsubscribe checkbox form in a div, used javascript function to reveal on click)

So change unsub reason form button to:

                 

<button type="submit" class="btn btn-default btn-primary" onclick="HideTop();ReasonSubmit()">Send</button>

 

And in the script add:
 

        function ReasonSubmit() {
    document.getElementById("UnsubDiv").style.display = "";
        }
         
         function HideTop() {
  var x = document.getElementById("hideDIV");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}

 

Surround the unsub reason form with <div id=”hideDIV”>
Make sure to start the div just before the unsub reason form, and don’t forget to close off the div (</div) AFTER the unsub reason form only.

 

Surround the unsub checkbox form with <div id=”UnsubDiv”>
Make sure to start the div just before the unsub checkbox form, and don’t forget to close off the div (</div) AFTER the unsub checkbox form only.

 

Here is the FULL HTML, it’s Klaviyo’s example edited to include the above; but PLEASE NOTE that because of my trial and error, there may be some unnecessary code in there because I’m a novice -- it’s working fine for me though! Now I have created segments in Klaviyo where the properties equal each of the Unsubscribe reasons so I can see why people are unsubscribing. :D 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<style type="text/css">
/* Space out content a bit */
body {
padding-top: 20px;
padding-bottom: 20px;
padding-left: 20px;
padding-right: 20px;
font-family: 'Neue Helvetica', sans-serif;
}

form {
margin-bottom: 18px;
}

/* Custom page header */
.header {
border-bottom: 1px solid #e5e5e5;
margin-bottom: 10px;
}

.header h1 {
margin: 10px 0;
font-size: 24px;
}

.required-fields {
text-align: right;
}

.required-fields span {
color: #a94442;
font-weight: bold;
}

.list-group-item label {
font-weight: normal;
margin-top: 17px;
}

.list-group-item label input type="checkbox"] {
margin-right: 4px;
}

.form-group span.required {
position: absolute;
top: 0;
right: 0;
font-size: 20px;
color: #a94442;
font-weight: bold;
user-select: none;
}

.label.error {
color: #a94442;
font-weight: bold;
margin-top: 4px;
}

.form-actions {
margin: 25px 0;
}

.form-control+.form-control {
margin-top: 6px;
}

.panel-group .panel-title .closed-icon,
.panel-group .panel-title .open-icon {
margin-right: 0.5em;
top: 2px;
}

.panel-group .panel-title a:hover,
.panel-group .panel-title a:active {
text-decoration: none;
}

.panel-group .panel-title a:hover .text,
.panel-group .panel-title a:active .text {
text-decoration: underline;
}

.panel-group .panel-title .closed-icon {
display: none;
}

.panel-group.closed .panel-title .open-icon {
display: none;
}

.panel-group.closed .panel-title .closed-icon {
display: inline;
}

.btn {
border-radius: 0;
border: none;
background-color: black;
}

.btn:hover {
background-color: black;
}

/* Custom page footer */
.footer {
padding-top: 18px;
border-top: 1px solid #e5e5e5;
}

/* Customize container */
@media (min-width: 768px) {
.container {
max-width: 730px;
}
}
</style>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--Nif lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<!hendif]-->
</head>
<body>
<div class="container">
<div class="header">
<!-- Custom logo (add logo image as asset in Klaviyo, add name below where it says logo.png* -->
<img src="{% asset_url 'logo.png' %}" width="300px" />
<h1 style="color: black;">Unsubscribe from newsletters</h1>
<br>
</div>
<div>
&nbsp;
</div>
<div id="hideDIV">
<form action="" id="preferences_form" method="POST" role="form" class="form-horizontal" target="formresponse">
{% if form.non_field_errors %}
<div class="alert alert-danger">
{% for error in form.non_field_errors %}
{{ error }}{% if not forloop.last %}<br />{% endif %}
{% endfor %}
</div>
{% endif %}
<input type="hidden" name="$fields" value="EmailInterests,EmailFrequency,UnsubscribeReason" />
<input type="hidden" name="$list_fields" value="EmailInterests" />
<!-- <input type="hidden" name="$unsubscribed_url" value="/p/preferences_updated" /> -->
<!-- <input type="hidden" name="$updated_profile_url" value="/p/preferences_updated" /> -->
<!--<p class="required-fields">
<span>*</span> Required Information
</p>-->
<div class="form-group{% if form.errors|lookup:'$email' %} has-error{% endif %}">
<label for="email" class="col-sm-3 control-label">Email Address<span class="required">*</span></label>
<div class="col-sm-9">
<input type="email" class="form-control" id="email" name="$email" value="{% if request.POST|lookup:'$email' %}{{ request.POST|lookup:'$email' }}{% else %}{{ person.email|default:'' }}{% endif %}" />
{% if form.errors|lookup:'$email' %}
<p class="help-block">{% for error in form.errors|lookup:'$email' %}{{ error }}{% endfor %}</p>
{% endif %}
</div>
</div>
<div class="form-group">
<label for="first_name" class="col-sm-3 control-label">First Name (optional)</label>
<div class="col-sm-9">
<input type="text" class="form-control" id="first_name" name="$first_name" value="{% if request.POST|lookup:'$email' %}{{ request.POST|lookup:'$first_name' }}{% else %}{{ person.first_name|default:'' }}{% endif %}" />
</div>
</div>
<div>
&nbsp;
</div>
<div id="reasons">
<div class="form-group">
<label for="UnsubscribeReason">Please tell us why you're unsubscribing (we want to learn and do better)!</label>
<div class="radio" id="reason-1" required>
<label>
<input type="radio" name="UnsubscribeReason" id="unsubscribe_reason_1" value="Unwanted" required {% if person.UnsubscribeReason == 'Unwanted' or request.POST.UnsubscribeReason == 'Unwanted' %}checked="checked"{% endif %} />I don't remember subscribing/didn't want to subscribe.</label>
</div>
<div class="radio">
<label>
<input type="radio" name="UnsubscribeReason" id="unsubscribe_reason_2" value="Unexpected Subjects" {% if person.UnsubscribeReason == 'Unexpected Subjects' or request.POST.UnsubscribeReason == 'Unexpected Subjects' %}checked="checked"{% endif %} />What I've received wasn't the type of emails I expected from you.</label>
</div>
<div class="radio">
<label>
<input type="radio" name="UnsubscribeReason" id="unsubscribe_reason_2" value="Too Many" {% if person.UnsubscribeReason == 'Too Many' or request.POST.UnsubscribeReason == 'Too Many' %}checked="checked"{% endif %} />I've received too many emails from you.</label>
</div>
<div class="radio">
<label>
<input type="radio" name="UnsubscribeReason" id="unsubscribe_reason_3" value="Discount Code Only" {% if person.UnsubscribeReason == 'Discount Code Only' or request.POST.UnsubscribeReason == 'Discount Code Only' %}checked="checked"{% endif %} />I only wanted the discount code.</label>
</div>
<div class="radio">
<label>
<input type="radio" name="UnsubscribeReason" id="unsubscribe_reason_4" value="Too Expensive" {% if person.UnsubscribeReason == 'Too Expensive' or request.POST.UnsubscribeReason == 'Too Expensive' %}checked="checked"{% endif %} />Not in my budget.</label>
</div>
<div class="radio">
<label>
<input type="radio" name="UnsubscribeReason" id="unsubscribe_reason_5" value="Other" {% if person.UnsubscribeReason == 'Other' or request.POST.UnsubscribeReason == 'Other' %}checked="checked"{% endif %} />Other</label>
</div>
</div>
</div>
<div class="clearfix form-actions">
<div class="pull-right">
<button type="submit" class="btn btn-default btn-primary" onclick="HideTop();ReasonSubmit()">Send</button>
</div>
</div>
</form>
</div>
<iframe name='formresponse' width='100%' height='auto' style="display:none"></iframe>
<div id="UnsubDiv" style="display:none">
<form action="" id="preferences_form" method="POST" role="form" class="form-horizontal">
{% if form.non_field_errors %}
<div class="alert alert-danger">
{% for error in form.non_field_errors %}
{{ error }}{% if not forloop.last %}<br />{% endif %}
{% endfor %}
</div>
{% endif %}
<input type="hidden" name="$fields" value="EmailInterests,EmailFrequency,UnsubscribeReason" />
<input type="hidden" name="$list_fields" value="EmailInterests" />
<!-- <input type="hidden" name="$unsubscribed_url" value="/p/preferences_updated" /> -->
<!-- <input type="hidden" name="$updated_profile_url" value="/p/preferences_updated" /> -->
<!--<p class="required-fields">
<span>*</span> Required Information
</p>-->
<div class="form-group">
<p>
<p style="font-weight:normal"><b style="color:red">One last step!</b> Click below to confirm you would like to unsubscribe from all newsletters and notifications about sales, new launches, etc. (This doesn't include order and shipping confirmations and the like.) We're sorry to see you go!</p>
<div class="form-group{% if form.errors|lookup:'$email' %} has-error{% endif %}">
<label for="email" class="col-sm-3 control-label">Confirm Email Address<span class="required">*</span></label>
<div class="col-sm-9">
<input type="email" class="form-control" id="email" name="$email" value="{% if request.POST|lookup:'$email' %}{{ request.POST|lookup:'$email' }}{% else %}{{ person.email|default:'' }}{% endif %}" />
{% if form.errors|lookup:'$email' %}
<p class="help-block">{% for error in form.errors|lookup:'$email' %}{{ error }}{% endfor %}</p>
{% endif %}
</div>
</div>
<div class="checkbox">
<label>
<input type="checkbox" id="unsubscribe" name="$unsubscribe" value="true" checked/>
<span class="text"><b>Unsubscribe me from all emails</b></span>
</label>
</div>
<div class="clearfix form-actions">
<div class="pull-right">
<button type="submit" class="btn btn-default btn-primary">Unsubscribe</button>
</div>
</div>
</div>
</form>
</div>
<footer class="footer">
<p>
© 2022 Your Company Inc. — <a href="https://www.google.ca/" target="_blank">Privacy Policy</a>
</p>
</footer>
</div>
<!-- /container -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function() {
$('#preferences_form').validate({
rules: {
$email: {
required: true
}
},
messages: {
$email: 'Please enter your email address.',
$first_name: 'Please enter your first name.',
}
});
// Toggle validation based on selection.
$('input name="$unsubscribe"]').on('change', function() {
$('form .form-actions buttonutype="submit"]').toggleClass('cancel', $(this).is(':checked'));
});
});



// Listen for click on toggle checkbox
$('#select-none-2').click(function(event) {
if(this.checked) {
// Iterate each checkbox
$('#select-none, #select-off, #select-off-2, #select-off-3, #select-off-4').each(function() {
this.checked = false;
});
}
});

$('#select-none').click(function(event) {
if(this.checked) {
// Iterate each checkbox
$('#select-none-2, #select-off, #select-off-2, #select-off-3, #select-off-4').each(function() {
this.checked = false;
});
}
});

$('#select-all').click(function(event) {
if(this.checked) {
// Iterate each checkbox
$('#select-off, #select-off-2, #select-off-3, #select-off-4').each(function() {
this.checked = true;
});
}
});

var unsubscribe = document.getElementById('unsubscribe');
var reason_div = document.getElementById('reason');
unsubscribe.onclick = function() {
console.log(this);
if(this.checked) {
reason_div.style 'display'] = 'block';
} else {
reason_div.styles'display'] = 'none';
} if(this.unchecked) {
reason_div.style['display'] = 'none';
}
};

function ReasonSubmit() {
document.getElementById("UnsubDiv").style.display = "";
}

function HideTop() {
var x = document.getElementById("hideDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
</script>
</body>
</html>

Hope this helps!!


Hi there @bricatfree,

That is a great response and clever workaround! Thank you so much for providing our fellow community members with your response and I hope they and others can find this information useful.

 

All the best,

Alex


Thanks for the tips everyone. 

It’s a pretty common feature with other ESPs...wonder when Klaviyo will add it.


Hoping Klaviyo adds this as standard functionality without needing to build clunky coded workarounds. Every other ESP offers this as standard, I don’t see why its been omitted here. 


Reply