mfkp/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
	<script src="jquery.ketchup.all.min.js" type="text/javascript"></script>
</head>
<body>
		<div id="email">
			<span>Enter your email to sign up</span>
			<form action="/subscribe.php" id="invite" method="POST">
				<input type="text" placeholder="your@email.com" name="email" id="address" data-validate="validate(required, email)"/>
				<button type="submit">&#187;</button>
			</form>
			<span id="result"></span>
		</div>
<script type="text/javascript">
$(document).ready(function() {
	$('#invite').ketchup().submit(function() {
		if ($(this).ketchup('isValid')) {
			var action = $(this).attr('action');
			$.ajax({
				url: action,
				type: 'POST',
				data: {
					email: $('#address').attr('value')
				},
				success: function(data){
					$('#result').html(data).css('color', 'green');
				},
				error: function() {
					$('#result').html('Sorry, an error occurred.').css('color', 'red');
				}
			});
		}
		return false;
	});
});
</script>
</body>
</html>

## subscribe.php
<?php
$apiKey = 'your-api-key';
$listId = 'your-list-id';
$double_optin=false;
$send_welcome=false;
$email_type = 'html';
$email = $_POST['email'];
//replace us2 with your actual datacenter
$submit_url = "http://us2.api.mailchimp.com/1.3/?method=listSubscribe";
$data = array(
    'email_address'=>$email,
    'apikey'=>$apiKey,
    'id' => $listId,
    'double_optin' => $double_optin,
    'send_welcome' => $send_welcome,
    'email_type' => $email_type
);
$payload = json_encode($data);

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $submit_url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, urlencode($payload));

$result = curl_exec($ch);
curl_close ($ch);
$data = json_decode($result);
if ($data->error){
    echo $data->error;
} else {
    echo "Got it, you've been added to our email list.";
}
	<!DOCTYPE html>
	<html>
	<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
	<script src="jquery.ketchup.all.min.js" type="text/javascript"></script>
	</head>
	<body>
	<div id="email">
	<span>Enter your email to sign up</span>
	<form action="/subscribe.php" id="invite" method="POST">
	<input type="text" placeholder="your@email.com" name="email" id="address" data-validate="validate(required, email)"/>
	<button type="submit">»</button>
	</form>
	<span id="result"></span>
	</div>
	<script type="text/javascript">
	$(document).ready(function() {
	$('#invite').ketchup().submit(function() {
	if ($(this).ketchup('isValid')) {
	var action = $(this).attr('action');
	$.ajax({
	url: action,
	type: 'POST',
	data: {
	email: $('#address').attr('value')
	},
	success: function(data){
	$('#result').html(data).css('color', 'green');
	},
	error: function() {
	$('#result').html('Sorry, an error occurred.').css('color', 'red');
	}
	});
	}
	return false;
	});
	});
	</script>
	</body>
	</html>