Sendy Sign Up Form - Redirection Options

raymondkent · April 11

Sendy is great, but as marketers sometimes we want to send some users to a different thank you urls after signing up to a list.

In Sendy, by default you can only set one custom url per list. Which is brilliant and super easy if that's all you want.

But if you want to have different thank you urls for the same list, then you need to do something a bit different.

This html and script code allows you to create a subscription form for any list and have any thank you url.

So for the same list, you can create different forms with different urls to different thank you pages.

The sample code below also shows how to include hidden fields to update custom fields such as "Tag" and "Status"(you do need to create custom fields in Sendy first)

IMPORTANT:

The following code is basic, and only contains checking to see if the name field is empty and if the email address is in a valid format.

It is not checking the API response. So if there is an error at the API level you won't know.
Also, if the SAME email address is used, then this will update/overwrite whatever data was associated with the previous entry. It won't alert the user that they are already subscribed to the list.

So yes, there are some limitations, but you might find the idea/concept and code helpful as a guide.

You can paste the form code + script directly into a wordpress custom html field, or as html on any webpage.

Just update the variables below with your data.
NOTE: replace everything between the quotation marks including the square brackets

In the <form....  

update the following to your requirements

action="[enter in your sendy install url followed  by /subscribe]" i.e https://mysite/sendy/subscribe

Custom fields (in this example)
Tag = " [opted-in]"                     could be the campaign name for this form, or any other useful Tag value
Status = "[New]"         could be something like NewLead, Onboarding or anything else you want

**Note you can use Custom field values to create segment within a List. Note Creating Segmenting rules in Sendy are case sensitive.

List = "[list_id"]  enter in the unqiue list ID from Sendy that you want to add the subscribers to.

___________________
In the <script> section 

update the [desired url]  you want to send the user to.

window.location.href='[desired url]';




The Script:

Below is the full webpage code. 

You can copy and save the full code to create a webpage with an opt-in form

or just copy everything from 

<form 
to
</script>

and paste into wordpress as custom html or into any webpage.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Subscribe Form</title>
</head>
<body>
<form id="subscribeForm" action="[https://yourwebsite/sendy/subscribe]" method="POST" accept-charset="utf-8">
<label for="name">Name</label><br/>
<input type="text" name="name" id="name"/><br/>
<label for="email">Email</label><br/>
<input type="email" name="email" id="email"/><br/>
<input type="hidden" name="Tag" value="[opted-in]"/>
<input type="hidden" name="Status" value="[NewLead"/>
<input type="hidden" name="list" value="[List_Id"/>
<div style="display:none;">
    <label for="hp">HP</label><br/>
    <input type="text" name="hp" id="hp"/>
</div>  
<input type="hidden" name="subform" value="yes"/>
<input type="submit" name="submit" id="submit"/>
</form>

<script>
document.getElementById('subscribeForm').addEventListener('submit', function(event) {
// Prevent default form submission
event.preventDefault();

// Get the form's action URL
var formAction = this.getAttribute('action');

// Get the values of name and email fields
var name = document.getElementById('name').value.trim();
var email = document.getElementById('email').value.trim();

// Perform error checking
if (!name) {
    alert('Your name is required. Please enter your name.');
    return;
}

if (!isValidEmail(email)) {
    alert('Please enter a valid email address.');
    return;
}

// Create XMLHttpRequest object
var xhttp = new XMLHttpRequest();

// Define callback function
xhttp.onreadystatechange = function() {
    if (this.readyState == 4) {
    // Redirect user after form submission
    window.location.href = '[your desired thank you url]';
    }
};

// Set up request
xhttp.open("POST", formAction, true);

// Send form data
xhttp.send(new FormData(this));
});

// Function to check if an email address is valid
function isValidEmail(email) {
// Regular expression for validating email addresses
var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return emailRegex.test(email);
}
</script>

</body>
</html>

I'm not a coder, so if there are improvements on the above feel free to comment.

Hope this helps anyone who is looking for such an option.

Reach out if you would like any support with the above.

ray@dmfunnels.com

Cheers
Ray