will
19034a026e
Blog with contact form and newsletter signup, structured like the other Reground-hosted sites but with its own visual identity.
52 lines
2.0 KiB
HTML
52 lines
2.0 KiB
HTML
{{/* Standalone newsletter signup — not tied to any ARC/giveaway flow.
|
|
Posts a JSON body to {eec_base_url}/subscribe. Include anywhere with
|
|
{{ partial "subscribe-form.html" . }}. */}}
|
|
{{ $id := printf "subscribe-%d" (now.UnixNano) }}
|
|
<form id="{{ $id }}" class="subscribe-form">
|
|
<label for="{{ $id }}-email" class="sr-only">Email address</label>
|
|
<input type="email" id="{{ $id }}-email" name="email" required autocomplete="email" placeholder="you@example.com">
|
|
|
|
<div class="field-honeypot" aria-hidden="true">
|
|
<label for="{{ $id }}-website">Leave this field empty</label>
|
|
<input type="text" id="{{ $id }}-website" name="website" tabindex="-1" autocomplete="off">
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-subscribe">Subscribe</button>
|
|
</form>
|
|
<p id="{{ $id }}-status" role="status" class="subscribe-status"></p>
|
|
|
|
<script>
|
|
(function () {
|
|
var form = document.getElementById("{{ $id }}");
|
|
var status = document.getElementById("{{ $id }}-status");
|
|
form.addEventListener("submit", function (e) {
|
|
e.preventDefault();
|
|
if (form.website.value) return; // honeypot
|
|
var payload = {
|
|
email: form.email.value
|
|
};
|
|
var submitBtn = form.querySelector("button[type=submit]");
|
|
submitBtn.disabled = true;
|
|
status.textContent = "Subscribing…";
|
|
fetch("{{ .Site.Params.eec_base_url }}/subscribe", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(payload)
|
|
}).then(function (res) {
|
|
submitBtn.disabled = false;
|
|
if (res.ok) {
|
|
form.reset();
|
|
status.textContent = "You're on the list — check your inbox to confirm.";
|
|
return;
|
|
}
|
|
return res.text().then(function (msg) {
|
|
status.textContent = msg || "Something went wrong. Try again in a moment.";
|
|
});
|
|
}).catch(function () {
|
|
submitBtn.disabled = false;
|
|
status.textContent = "Something went wrong. Try again in a moment.";
|
|
});
|
|
});
|
|
})();
|
|
</script>
|