HTML Form to File.txt
After a site redesign my photo publishing workflow is as follows:
- After choosing a photograph in Lightroom, I export it into the
imagesfolder of my Hugo-powered site on my computer.
- I create a plain text file (in my case, in Markdown format with YAML front matter) specifying the title, date, location, tags, and so on, and save it in the
- I type
./deployin the Terminal so Hugo generates the site with latest changes and pushes them to a GitHub repo that generates simongriffee.com.
I did this because:
- As is often the case with web programming, someone else had already done most of the work.
- Anyone who has a web browser can make use of the script, and it can be modified for other use cases.
- A web form is a familiar user interface with built-in advantages provided by the browser like pressing the Tab key to go to the next field and remembering previous input with autocomplete for repetitive entries. For example, if I often publish photos taken in New York City, using a form input field like lets me type the letter N, press the ↓ down arrow and then press Tab to fill in the previously entered value and move to the next field.
Here’s a demo. Go ahead and fill it in and click the Save to File button:
- Download and save this index.html file to your desktop or any location on your computer.
- If you like, edit
index.htmllocally with your web browser, fill in the form fields and click Save To File. You can also put
index.htmlin a folder on your web server so you can access it from any computer, as I’ve done here.
I’ve tested the script on the latest version of Firefox on Mac OS. It also also works on Chrome, but the autocomplete doesn’t seem to work unless the form fields are wrapped in a form tag with the autocomplete attribute (
<form autocomplete="on">…</form>), and when I do this the entire form disappears in Firefox. I’m investigating and appreciate pull requests on GitHub.