Consume Google Forms (the actual form frontend) and turn it into naked HTML

[davidrleonard]

Internal use case:

David wants to add a form to the Code for America website. He knows a little HTML and can use the Github.com editor, but he can't write CSS or complicated form markup.

David should be able to make a Google Form, copy the URL, paste it into Magic Form Thingy, and get well-formatted HTML and JavaScript out that styles the form according to the CfA pattern library. David can paste this code into his Github.com editor and have a nice form ready to go sending data to a Google Sheet.

External use case:

Jenny needs a contact form for project website. She needs to be able to receive and store users' contact information and plain-text requests. Jenny uses Bootstrap for her website, but doesn't want to embed a Google Form (eww iframes) or link to a popup that lives somewhere else.

Jenny should be able to make a Google Form, copy the URL, paste it into Magic Form Thingy, and get well-formatted HTML and JavaScript out that styles the form according to the Bootstrap documentation. Jenny can paste this code into her editor and have a nice form ready to go sending data to a Google Sheet.

Project Needs: ??? Status: pie-in-the-sky

[daguar]

Is it possible to style a GForm now?

On Jan 20, 2015, at 5:19 PM, David Leonard notifications@github.com wrote:

Internal use case:

David wants to add a form to the Code for America website. He knows a little HTML and can use the Github.com editor, but he can't write CSS or complicated form markup.

David should be able to make a Google Form, copy the URL, paste it into Magic Form Thingy, and get well-formatted HTML and JavaScript out that styles the form according to the CfA pattern library. David can paste this code into his Github.com editor and have a nice form ready to go sending data to a Google Sheet.

External use case:

Jenny needs a contact form for project website. She needs to be able to receive and store users' contact information and plain-text requests. Jenny uses Bootstrap for her website, but doesn't want to embed a Google Form (eww iframes) or link to a popup that lives somewhere else.

Jenny should be able to make a Google Form, copy the URL, paste it into Magic Form Thingy, and get well-formatted HTML and JavaScript out that styles the form according to the Bootstrap documentation. Jenny can paste this code into her editor and have a nice form ready to go sending data to a Google Sheet.

Project Needs: ??? Status: pie-in-the-sky

— Reply to this email directly or view it on GitHub.

[gangleton]

Not if it's hosted on Google forms. You can copy the markup that's generated into your own site though and apply your own stylings there. When the form is submitted it'll still bring you to the generic confirmation page though.

[davidrleonard]

Right, you can copy the markup and style yourself, but no function built in to GF to style other than themes.

You can also use JS to submit the form w/ Ajax, handle the response, and redirect to wherever you want/change stuff in the DOM to show errors/etc.

On Jan 21, 2015, at 10:16 AM, Serena Wales notifications@github.com wrote:

Not if it's hosted on Google forms. You can copy the markup that's generated into your own site though and apply your own stylings there. When the form is submitted it'll still bring you to the generic confirmation page though.

— Reply to this email directly or view it on GitHub.

[alanjosephwilliams]

Have you seen Github Forms by @benbalter?

https://github.com/benbalter/github-forms

On Wed, Jan 21, 2015 at 11:19 AM, David Leonard notifications@github.com wrote:

Right, you can copy the markup and style yourself, but no function built in to GF to style other than themes.

You can also use JS to submit the form w/ Ajax, handle the response, and redirect to wherever you want/change stuff in the DOM to show errors/etc.

On Jan 21, 2015, at 10:16 AM, Serena Wales notifications@github.com wrote:

Not if it's hosted on Google forms. You can copy the markup that's generated into your own site though and apply your own stylings there. When the form is submitted it'll still bring you to the generic confirmation page though.

— Reply to this email directly or view it on GitHub.

— Reply to this email directly or view it on GitHub https://github.com/codeforamerica/project-ideas/issues/55#issuecomment-70902661 .

t: @alanjosephwilli p: 817 713 6264

[benbalter]

Also https://github.com/benbalter/problem_child, which does the same, but the datastore is Issues, not CSV

[ondrae]

We stylized our own Google Form in some example thing we did last year. http://codeforamerica.github.io/story-bucket/ https://github.com/codeforamerica/story-bucket/blob/gh-pages/index.html