Components

Lead Capture

Build any type of form that integrates with Oaysus. Use field conventions to automatically create contacts, apply tags, and store custom data.

Overview

Oaysus provides a flexible form system that works with any form component. Add field conventions to your form inputs, and Oaysus handles contact creation, tagging, and data storage.

Convention-Based

Use data-oaysus-field attributes to map form fields to contact data, tags, or metadata automatically.

Any Form Type

Build newsletters, contact forms, wholesale inquiries, surveys, or any custom form your theme needs.

Auto-Inference

Common fields like email, firstName, and phone are automatically recognized without explicit mapping.

Contact Management

Form submissions create or update contact records with custom fields, tags, and activity history.

Field Conventions

Add the data-oaysus-field attribute to your form inputs to control how data is processed.

contact.email

Maps to contact email (primary identifier)

data-oaysus-field="contact.email"
contact.firstName

Maps to contact first name

data-oaysus-field="contact.firstName"
contact.lastName

Maps to contact last name

data-oaysus-field="contact.lastName"
contact.phone

Maps to contact phone number

data-oaysus-field="contact.phone"
contact.tag

Field value becomes a tag on the contact

data-oaysus-field="contact.tag"
contact.tag:value

Adds a static tag regardless of field value

data-oaysus-field="contact.tag:newsletter"
contact.custom.*

Stores value in contact custom fields

data-oaysus-field="contact.custom.company"
meta.*

Stores value in submission metadata

data-oaysus-field="meta.message"

Code Example

Here's a complete example of a contact form using field conventions. Each input includes a data-oaysus-field attribute to control how the data is processed. This form creates a contact with email and first name, stores company as a custom field, applies a dynamic tag based on the interest selection, adds a static "contact-inquiry" tag to all submissions, and stores the message in metadata. Fields named email, firstName, lastName, and phone are automatically mapped even without the data attribute.

ContactForm.html
1<form data-oaysus-form="contact-form">
2  <input
3    name="email"
4    type="email"
5    placeholder="Email"
6    data-oaysus-field="contact.email"
7    required
8  />
9
10  <input
11    name="firstName"
12    type="text"
13    placeholder="First Name"
14    data-oaysus-field="contact.firstName"
15  />
16
17  <input
18    name="company"
19    type="text"
20    placeholder="Company"
21    data-oaysus-field="contact.custom.company"
22  />
23
24  <select
25    name="interest"
26    data-oaysus-field="contact.tag"
27  >
28    <option value="wholesale">Wholesale</option>
29    <option value="retail">Retail</option>
30    <option value="partnership">Partnership</option>
31  </select>
32
33  <textarea
34    name="message"
35    placeholder="Message"
36    data-oaysus-field="meta.message"
37  ></textarea>
38
39  <!-- Static tag applied to all submissions -->
40  <input
41    type="hidden"
42    data-oaysus-field="contact.tag:contact-inquiry"
43  />
44
45  <button type="submit">Send Message</button>
46</form>

Form Examples

Here are common form types you can build. Any form that captures an email can create a contact record in Oaysus.

Newsletter Signup

Simple email capture for mailing lists

Fields:email
Tags:newsletter

Contact Form

Capture inquiries with name, email, and message

Fields:emailfirstNamelastNamemessage
Tags:contact-inquiry

Wholesale Inquiry

Lead capture with company info and budget

Fields:emailfirstNamecompanybudget
Tags:wholesalelead

Event Registration

Sign up for events with preferences

Fields:emailfirstNamelastNameeventDate
Tags:event-registration