Role: I built an improved and easy to use JavaScript menu for everyone
Project goal: A lot of small businesses and other site owners don’t need much more than static web pages, a contact form, and a well-functioning menu system where they can easily add and remove items. Many people have learned some HTML and CSS but not advanced into JavaScript or PHP. When I needed to expand my menu to beyond screen width and consequently add a submenu, even after learning significant JavaScript, I found it unworkable to extend the example code from PureCSS.io which I had been using.
Download and Readme: https://github.com/cooperdozier/easy-em
It’s under the MIT license, but I am also available to build sites for you, dear reader, or other interested interested parties, which you can order from my project catalog. See: https://www.upwork.com/services/product/development-it-multi-page-one-column-website-with-flexible-menu-contact-form-in-html-css-1735074862363910144
The Solutions:
For my website SaveTheOxygen.org, I eventually started from scratch and built a lightweight, fast menu with clear instructions for beginners and annotations explaining the rest. The site manager can then just read the instructions and alter the height values in the JavaScript in 4 places to extend or pare down their menu without over flow or leaving empty space. This does, of course also depend on the HTML structure of the menu section, and I couldn’t provide server side code for a contact form but lots of providers are available where you can just pay a few dollars and copy in code for the form they provide, Such as FormSpree.io .
Later I pared it down to the minimum and stripped out my graphics and content and published it on GitHub as Easy Em, a one column site design (below the header) that works with great speed on any device including flip phones. The first couple days there were about 45 clones made, so I think my code must have already been in use by an educator or two somewhere. It has slowed down quite a bit since then. It also includes a robust set of Open Graph and Twitter meta tags and as far as I can tell is fully compatible with ALL of Pure CSS framework, not only the very stripped down subset I still use.
Together with something like FormSpree.io ($8/mo) and the Shopify Starter plan ($5/mo) and Easy Em (free, if you can set up your styles and HTML content on your own and figure out the web hosting), you can have a very viable business site running for little more than the web hosting costs. Shopify Starter also comes with an in person POS system, and although it is unclear to me if it includes the embeddable Buy Button, you can propagate your links to the Shopify store anywhere (but it’s limited to one, very simple theme).
Live Preview: https://cooperdozier.github.io/easy-em/
This blog post is a portfolio entry taken from https://www.upwork.com/freelancers/~01a8cfbd8730a33e94?s=1044578476142100494&p=1757624752709312512 , however you can’t read it unless you’re logged in to Upwork, unlike the project catalog thing above (which has a bit of video).
PS – speaking of flip phones, or if you’re just trying to conserve data, two other sites that work well for them are lite.cnn.com & text.npr.org – plus they have no trackers, cookies, or images and very little styling. Took them entirely too long to figure out their system to link from text only article to the original version but they eventually did. Not easy to read the long lines if your window is wide, though.
Top featured image: Cut-down of photo by Oskar Yildiz on Unsplash
Lost in Mist 