Documentation - OneDollar

CORE FEATURES

Configurable Fields

Add/remove fields from dashboard. Name, email, message, etc.

Dashboard Storage

All submissions stored in one place. Easy to manage.

Success Messages

Customizable thank you message after submission.

Basic Validation

Required fields and email format checking.

INTEGRATION

Embedded Form

<!-- Place where you want the form -->
<div id="od-contact-YOUR-KEY"></div>

<!-- Add script before </body> -->
<script src="https://onedollar.dev/widgets/YOUR-KEY.js"></script>

Form renders inline in the container div. Style with CSS as needed.

CONFIGURATION

Widget Settings (Dashboard)

Form Title	Default: "Contact Us"
Form Fields	Add/remove fields, set labels and types
Submit Text	Button text (default: "Send Message")
Success Message	"Thanks for your message!"
Brand Color	Primary color for button/accents

CUSTOMIZATION

CSS Selectors

Widget-Specific ID
#od-contact-YOUR-KEY	Container for specific widget instance
Global Classes
.od-contact-form	Form container
.od-contact-field	Field wrapper
.od-contact-input	Text/email inputs
.od-contact-textarea	Message textarea
.od-contact-submit	Submit button

JAVASCRIPT API

// Access widget instance
const widget = window.OneDollarWidget['YOUR-KEY'];

// Submit programmatically
widget.submit({
  name: 'John Doe',
  email: 'john@example.com',
  message: 'Hello!'
});

// Reset form
widget.reset();

// Validate form programmatically
widget.validate();

REST API

Submit Contact

POST /api/v1/widgets/:key/submit

{
  "name": "John Doe",
  "email": "john@example.com",
  "message": "I'm interested in learning more..."
}

// Fields match dashboard configuration

Response (200 OK):
{
  "success": true,
  "message": "Thank you!"
}

Get Entries

GET /api/v1/widgets/:key/entries

Requires API key authentication. Returns paginated entries.

Headers: Authorization: Bearer YOUR_API_KEY

EXAMPLES

Basic Integration

<!-- Single contact form -->
<div id="od-contact-YOUR-KEY"></div>
<script src="https://onedollar.dev/widgets/YOUR-KEY.js"></script>

<!-- Multiple contact forms on same page -->
<div class="sales-section">
  <h2>Sales Inquiries</h2>
  <div id="od-contact-SALES-KEY"></div>
</div>

<div class="support-section">
  <h2>Get Support</h2>
  <div id="od-contact-SUPPORT-KEY"></div>
</div>

<script src="https://onedollar.dev/widgets/SALES-KEY.js"></script>
<script src="https://onedollar.dev/widgets/SUPPORT-KEY.js"></script>

Each form renders inside its container div. Multiple forms supported on same page.

Custom Styling

/* Style specific widget */
#od-contact-abc123 .od-contact-submit {
  background: #007bff;
  border-radius: 8px;
  padding: 12px 24px;
}

USE CASES

General Contact

Replace mailto links with a proper form.

Sales Inquiries

Collect leads and contact information.

Support Requests

Simple way to collect customer issues.

CONTACT WIDGET