Push S: Contact Form data to Google Sheets
S: Contact Form Builder is a lightweight Shopify form app with minimal storefront impact. LeadToSheet adds Google Sheets sync so you get structured lead data without sacrificing your store's page speed.
CMS: Shopify
Overview
S: Contact Form Builder is a minimalist Shopify form app designed for merchants who prioritize store performance. It offers easy setup, email notifications, custom fields, and a responsive design with minimal JavaScript overhead. LeadToSheet pairs well with this lightweight philosophy by adding Google Sheets sync through a single asynchronous script that does not degrade page load times.
Implementation checklist
- 1
Add the LeadToSheet SDK to theme.liquid
Go to Online Store > Themes > Edit code. Insert the script in theme.liquid before </body>. The LeadToSheet SDK loads asynchronously and adds negligible overhead, matching S: Contact Form Builder's lightweight approach.
theme.liquid snippet
<script>(function(w,d,s,u,k,e){if(w.__formsync){return}w.__formsync={q:[],k:k,endpoint:e};var js=d.createElement(s);js.src=u;js.async=1;js.onload=function(){w.__formsync.init&&w.__formsync.init({ clientKey:k })};d.head.appendChild(js);})(window,document,'script','https://www.leadtosheet.com/sdk.min.js','YOUR_CLIENT_KEY','https://www.leadtosheet.com/api/ingest');</script> - 2
Set up custom fields with clear name attributes
When building your form in S: Contact Form Builder, assign descriptive name attributes to each custom field. LeadToSheet uses these names directly as Google Sheet column headers.
Tip: Use lowercase names without spaces, like phone_number or company_size, for clean spreadsheet columns.
- 3
Submit a test entry and check performance impact
After installing both the form and the SDK, run a Lighthouse performance audit on your storefront. Confirm that the combined script footprint remains minimal and that your test submission appears in the Google Sheet.
Customization ideas
Monitor page speed alongside form conversions
Since S: Contact Form Builder is chosen for its lightweight footprint, track both page speed scores and form conversion rates in Google Sheets. Use LeadToSheet's device context data to identify if slower connections correlate with lower submission rates.
Enrich rows with customer segment data
LeadToSheet excludes hidden fields (input[type='hidden']), so Liquid template variables placed in hidden fields will not be captured. To enrich each row with customer type, login status, or geographic region, use visible read-only text fields or use Shopify's customer export to join segment data in Google Sheets.
Build a simple notification pipeline
S: Contact Form Builder sends email notifications, but for team-wide visibility, connect Apps Script to your Google Sheet to post new submissions to a Slack channel or create Trello cards automatically.
Troubleshooting
Form not rendering on specific page templates
S: Contact Form Builder may use a section include that does not load on all page templates. Verify that both the form section and the LeadToSheet script are present on the target page by checking the page source in your browser.
Responsive design fields misaligned on mobile
If form fields appear misaligned on mobile devices, check for CSS conflicts between S: Contact Form Builder's styles and your theme. Field name attributes are unaffected by CSS, so LeadToSheet will capture data correctly regardless of layout issues.
SDK adding perceived weight to a performance-focused store
The LeadToSheet SDK is under 5KB gzipped and loads asynchronously. It does not block rendering or delay Largest Contentful Paint. If you see performance concerns, verify no other scripts are conflicting with the async load.
Frequently asked questions
- Will LeadToSheet slow down my store?
- No. The SDK is under 5KB gzipped and loads asynchronously. It does not block page rendering, making it a natural fit alongside S: Contact Form Builder's lightweight design.
- Does S: Contact Form Builder support enough fields for my use case?
- S: Contact Form Builder supports custom fields, email, phone, and text areas. LeadToSheet captures whatever fields the form submits, so if the app meets your form needs, the sheet integration will work automatically.
- Can I add more data to each submission without adding form fields?
- Yes. LeadToSheet automatically captures page URL, referrer, UTM parameters, device type, and timestamp. Note that hidden fields (input[type='hidden']) are excluded by the SDK, so Liquid variables must be placed in visible form fields to be captured.