Solved

Using the API to Subscribe a Contact to a List


Badge
  • New Member
  • 3 replies

Hi there, below is the code we use to add a new email to our Klaviyo account. What do we need to change to get them added to a certain list? The API docs are a little over our heads.

<script>

var _learnq = _learnq || [];

  _learnq.push(['identify', {

    ‘$email’ : kyle@smp.com,

    ‘$source’: footer

  }]);

</script>

 

<script type="application/javascript" async src="https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=APIKEY"></script>

icon

Best answer by Dov 9 May 2022, 15:26

View original

3 replies

Userlevel 7
Badge +47

Hi @smp,

Thanks for sharing this question with the Klaviyo community.

I’m afraid you cannot use an identify call to subscribe a user to a specific list. Instead, you should be using the subscribe endpoint: https://a.klaviyo.com/api/v2/list/{list_id}/subscribe. After this request is made, by default, the user being subscribed will receive a double opt-in email asking them to confirm their subscription. Once confirmed, they will be added to the list specified in the call. We have an example request in our API documentation on that here.

Also keep in mind, there are plenty of other ways to subscribe users to lists in Klaviyo. Including adding them via a .csv file. This is ideal if you have a lot of users to add to a list at once. Or, you can quick add users to a list, an ideal method if you only have a handful of users you’d like to add to a list. And of course, using Klaviyo sign-up forms or a subscribe page.

I hope that’s helpful.  

 

Badge

Hi there, I used the API sample on my site: I replaced the APIKEYHERE with our actual api key in the live code.

<script>
const options = {
method: 'POST',
headers: {Accept: 'application/json', 'Content-Type': 'application/json'},
body: JSON.stringify({profiles: [{email: 'kyle@smp.com'}]})
};

fetch('https://a.klaviyo.com/api/v2/list/SpJ2xP/subscribe?api_key=APIKEYHERE', options)
.then(response => response.json())
.then(response => console.log(response))
.catch(err => console.error(err));
</script>

But it generates these errors in the console:

Access to fetch at 'https://a.klaviyo.com/api/v2/list/SpJ2xP/subscribe?api_key=APIKEYHERE' from origin 'https://www.sewingmachinesplus.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
VM3562:1          

POST https://a.klaviyo.com/api/v2/list/SpJ2xP/subscribe?api_key=APIKEYHERE net::ERR_FAILED
(anonymous) @ VM3562:1
(anonymous) @ b77.php:7571
b77.php:7574

TypeError: Failed to fetch
    at <anonymous>:1:876
    at b77.php:7571:1

Userlevel 7
Badge +47

Hi @smp,

Thanks for sharing this question with the Klaviyo community.

The endpoint you are trying to use is server-side only which is why you're receiving the CORS error. If you are making this request client-side, instead utilize this client-side endpoint: https://manage.kmail-lists.com/ajax/subscriptions/subscribe

var settings = {
"async": true,
"crossDomain": true,
"url": "https://manage.kmail-lists.com/ajax/subscriptions/subscribe",
"method": "POST",
"headers": {
"content-type": "application/x-www-form-urlencoded",
"cache-control": "no-cache"
},
"data": {
"g": "LIST_ID", // replace LIST_ID with id of list to be subscribed
"email": email,
// pass in additional fields, each additional field
// must be included in the $fields string separated by commas
"$fields": "$source, $first_name, $last_name",
"$source": "Account Creation",
"$first_name": firstname,
"$last_name": lastname
}
};
$.ajax(settings).done(function(response) {
console.log(response);
})

I hope this helps and thanks for being a member of our community.

Reply