208 lines
6.7 KiB
Plaintext
208 lines
6.7 KiB
Plaintext
<div id="wrapper" class="has-text-centered">
|
|
|
|
<section id="hero" class="hero is-medium">
|
|
<div class="hero-body">
|
|
<div class="container">
|
|
<h1 class="is-size-1 is-size-3-mobile">
|
|
The form backend for designers and developers
|
|
</h1>
|
|
<p class="tag-line is-size-5">
|
|
Link your online forms to <span class="google-sheets backend-logo"><%= image_tag 'google_sheets-icon.svg' %> Google Sheets</span> or <span class="airtable backend-logo"><%= image_tag 'airtable-icon.svg' %> Airtable</span> and receive form submissions in your favorite spreadsheet tool.
|
|
</p>
|
|
<p class="call-to-action">
|
|
<%= link_to "Get started", signup_url, class: 'is-uppercase button is-rounded is-primary has-text-white a-menu' %>
|
|
or try our <%= link_to "Live demo", demo_url %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section class="section howto has-white-mustard-gradient">
|
|
<div class="container">
|
|
<div class="columns">
|
|
<div class="column">
|
|
<div class="box">
|
|
<article class="media">
|
|
<div class="media-left">
|
|
<h3 class="title">1.</h3>
|
|
</div>
|
|
<div class="media-content">
|
|
<h3 class="title is-size-4">Create a new form</h3>
|
|
<p>
|
|
tinyforms will automatically create and link a connected Google Sheets document for you.
|
|
</p>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<div class="box">
|
|
<article class="media">
|
|
<div class="media-left">
|
|
<h3 class="title">2.</h3>
|
|
</div>
|
|
<div class="media-content">
|
|
<h3 class="title is-size-4">Point your form to our server</h3>
|
|
<p>
|
|
Simply configure your form to POST to your tinyforms URL.
|
|
</p>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<div class="box">
|
|
<article class="media">
|
|
<div class="media-left">
|
|
<h3 class="title">3.</h3>
|
|
</div>
|
|
<div class="media-content">
|
|
<h3 class="title is-size-4">Done!</h3>
|
|
<p>
|
|
tinyforms will automatically append each submission to your Google Sheets or Airtable document.
|
|
</p>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section class="section features has-mustard-bg has-text-white">
|
|
<div class="container">
|
|
<div class="columns is-multiline is-centered">
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
Your form, your design!
|
|
</h3>
|
|
<p class="paragraph">
|
|
Create beautiful online forms without any restrictions.<br>Tinyforms stays completely in the background.
|
|
</p>
|
|
<p>
|
|
Do you need help creating your forms? We'll help you!
|
|
</p>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
Full Google and Airtable flexibility
|
|
</h3>
|
|
<p class="paragraph">
|
|
Use all your favorite Google Sheets and Airtable features.
|
|
<br>
|
|
For example: share the document with your coworkers or use field formulas.
|
|
<br>
|
|
tinyforms follows your column setup and appends each form submission.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
Super simple setup
|
|
</h3>
|
|
<p class="paragraph">
|
|
Create a new tinyform, point your online from to our servers, done!
|
|
<br>
|
|
tinyforms will start processing submissions automatically and add them to your spreadsheets in real-time.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
Spam protection
|
|
</h3>
|
|
<p class="paragraph">
|
|
Nobody likes spam. We help you to keep your data clean.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
File uploads
|
|
</h3>
|
|
<p class="paragraph">
|
|
Easily collect documents, photos, file, music and more.
|
|
<br>
|
|
We take care of the storage for you.
|
|
<br>
|
|
Files are added as secure links to your spreadsheet.
|
|
</p>
|
|
</div>
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
JavaScript/AJAX ready
|
|
</h3>
|
|
<p class="paragraph">
|
|
Use our JavaScript library or our API directly to submit data using JavaScript.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
Email autoresponder
|
|
</h3>
|
|
<p class="paragraph">
|
|
Send an individual email reply to submitters confirming that you've received their submission.
|
|
</p>
|
|
</div>
|
|
<div class="column">
|
|
<h3 class="is-size-3">
|
|
Email notifications
|
|
</h3>
|
|
<p class="paragraph">
|
|
Don't miss a new submission. Get notified via email.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section class="section">
|
|
<div class="container">
|
|
<h3 class="is-size-3">
|
|
Missing a feature? Questions?
|
|
</h3>
|
|
<p class="paragraph">
|
|
We are building tinyforms to make your work easier! Let us know what we can do for you.
|
|
</p>
|
|
<form method="POST" class="contact-form has-text-left" action="https://tinyforms.herokuapp.com/s/mT4qT3SjGczmKpFhKXdw4YRW">
|
|
<div class="columns is-centered">
|
|
<div class="column is-one-third">
|
|
<div class="field">
|
|
<label class="label">Your email</label>
|
|
<div class="control">
|
|
<input class="input" type="text" name="email" placeholder="me@earth.com">
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<label class="label">Message</label>
|
|
<div class="control">
|
|
<textarea class="textarea" name="message" placeholder="How can we help you?"></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="control has-text-centered">
|
|
<button class="button is-primary">Submit</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</section>
|
|
|
|
</div>
|
|
|