How do I create an email collection form and add it to my website?

Sound familiar?

People visit your website every day and leave without a trace. You would love a growing email list, but the sign-up tools you have seen either look clunky or live in yet another system. An email collection form is built in Co-Kinetic, placed on your own site, and feeds sign-ups straight into your contacts — tagged, grouped and automated 🧲.

What's happening

You build the form once in Widgets, style it to your brand, and embed it on any page of your website. When someone fills it in, they are added to your contacts (or matched to an existing record), your chosen tag is applied, they are treated as subscribed to your communications, and your post-capture rules can send them straight into an email workflow, a prize draw or a date-based promotion — several rules can run in parallel.

Why it works this way

A list you own is the one marketing asset no algorithm can take away, and the whole point of the design is that a sign-up needs no follow-up admin from you: the tag records where they came from, the rules decide what happens next, and the same form can live on ten pages while being edited in one place 🙂.

What to do now

  1. Click Widgets on the left-hand menu, find Email Collection Forms, click Manage, and create a new form.
  2. Name and tag it — a clear name ("Clinic Newsletter Sign Up") and a lowercase-with-hyphens tag (newsletter-sign-up) so you always know where these contacts came from.
  3. Write the headline and description visitors will see; short and friendly wins.
  4. Add media if you like — an image or video, top or bottom. Optional.
  5. Choose your fields. Email and First name are pre-selected and required; you can also collect Last name, Phone, Date of birth and Postcode. Date of birth is worth having if you ever want birthday promotions — just do not rely on it being present for every contact, as an oddly-formatted date cannot always be read.
  6. Layout and success page: single or two column, and optionally a success URL (a thank-you page on your site). Left blank, visitors simply see a confirmation.
  7. Style your two buttons. The launch button is the call-to-action visitors see on your page — give it your boldest brand colour, and text that fits the context ("Sign Up Here"). The submit button completes the form — label it naturally and style it to match. Width, radius, bold and shadow are all adjustable.
  8. Set the post-capture rules — the destinations modal is where you decide what happens to each sign-up: into an email workflow, a prize draw, a date-based promotion, or any combination in parallel. Skippable; contacts arrive in your list either way.
  9. Save, and switch the form on with its toggle (greyed = off, blue = on).
  10. Embed it: open the form's Embed Code, choose Button with Modal (Recommended) or Simple Link, copy the code, and paste it into your page in your website editor's code view. Save and view the page. The form's card shows "Not installed" until the embed is placed somewhere.
  11. Test it on the live page with your own details, then check the sign-up arrived in the form's submissions view — that is also where you will watch the list grow.

The Widgets section in the left-hand menu

Customising the buttons

Two things worth knowing: the signer-upper does not receive an automatic confirmation email — if you want them to get something immediately, point a post-capture rule at a workflow whose first email welcomes them. And the public form runs on your widget subscription: if that subscription is not active, visitors see a holding message and submissions are refused, so keep it current on a page that matters.

The question behind the question

"Will anyone actually fill this in?" More than you would think, if you place it where the value is: at the end of a blog post someone just found useful, on the condition page they searched for, next to a genuinely tempting reason to sign up. A form floating on a homepage collects little; a form that appears right after you have just helped someone collects steadily. That is also why you can make as many forms as you like — one per purpose, each with its own tag, so you learn which placements earn their keep 📈.

The next question is usually...

Still stuck? This usually means...