Documentation Index
Fetch the complete documentation index at: https://dataglue.io/llms.txt
Use this file to discover all available pages before exploring further.
Form Integration
DataGlue automatically populates form fields with stored visitor data, reducing friction and improving conversion rates.
Basic Setup
Add glue attributes to your form fields:
<form>
<input type="text" glue="glue_fname" placeholder="First Name" />
<input type="email" glue="email" placeholder="Email Address" />
<input type="hidden" glue="glue_initial_utm_source" />
<button type="submit">Submit</button>
</form>
Selector Patterns
DataGlue recognizes multiple selector patterns:
Direct Glue Attributes
<input glue="email" />
<input glue="glue_fname" />
ID-based Selectors
<input id="glue_email" />
<input id="field_glue_fname" />
Class-based Selectors
<div class="field_email">
<input /> <!-- Automatically populated -->
</div>
Fillout Integration
For Fillout forms, DataGlue automatically adds data attributes:
<!-- Before DataGlue -->
<div data-fillout-id="form123"></div>
<!-- After DataGlue processes -->
<div data-fillout-id="form123"
data-glue_email="user@example.com"
data-utm_source="linkedin">
</div>
Advanced Configuration
<!-- Different forms can use the same data -->
<form id="newsletter">
<input glue="email" />
</form>
<form id="contact">
<input glue="email" /> <!-- Same email auto-populated -->
</form>
Conditional Fields
// Show/hide fields based on visitor data
if (window.glue.storage.get('glue_user_tier') === 'premium') {
document.getElementById('premium-fields').style.display = 'block';
}
Best Practices
- Use Consistent Naming: Stick to
glue_ prefix for custom attributes
- Test Selectors: Verify form fields populate correctly
- Handle Missing Data: Provide fallbacks for empty fields
- Privacy Compliance: Only collect necessary information