brianzelip / azellaz.com Goto Github PK

• xml sitemap

• canonical links

• robots.txt

• humans.txt

• RSS

• consolidate and automate meta descriptions

• schema.org, "rich snippets" stuff

  • ie, availability, price, etc

• more Yoast features

see my webliography on this topic

• email receipt to customers
• cart (entire flow, from add/sub an item, to enter personal deets)
• order IDs (ie, SNIP-1004; should be AZ-114 or something above 100)
• add item pic to order cart and receipt
• add the feature, when cart is open, click anywhere outside of the cart to return to site

Would be AWESOME if I could bulk-add new items by uploading a csv. (I'm imagining this would populate all of the information except photos, which I could then go in to each product listing and add in the CMS.)

attaching photos of what this looks like in craftybase:

${slug}-${view}-bag-by-Azellaz.jpg

this is so I can parse out the view for alt and title attributes on product thumbnails.

Create a simpler workflow for updating about and contact pages, to improve on the current workflow of Abbie emailing me copy to add to markup; ie, make it easier for the content creator/maintainer to directly change live copy.

opacity and z-index

Q: why am i applying a css class to make the hero image?
A: Because background-size: cover;?

• add padding to nav, add bg color to nav for readability - hardcoding this is the easiest way to get something working across all hero images
• adjust cart padding / the way it mixes with the AZ logo on small

See the create-product-files branch

The holiday flash needs to change after the "order by" date. This means there is a "order by" string, and a "orders from this day forward" string. These strings can be abstracted to _config.yml to manually change them at the appropriate time. (a more dynamic approach would be to assign the two strings to javascript consts, and run a query on page load for if today after orderBy, output ordersFromNow.

Let's make the holiday flash more dynamic

• add two new keys to _config.yml
• add liquid statement to holiday-flash.html

• separate images used in production from those only used for development

• semantic file naming

• copy and resize all product images for thumbnails for shop grid items and for product item thumbnails - created both thumbs-med (25% resize of full size product images), and thumbs-sm (50x50 resize of full size product images)

• lazy load shop grid thumbnails

• lazy load product images

• create retina versions (2x and 3x) of all product images

• implement <picture> elements (for dynamically serving appropriate images sizes/resolution -- there are some npm packages for this)

• create favicon

respond to GitHub vulnerability alerts. After #36, there is another alert, so making one issue and PR for all the rest that may come.

• CSS mods

• js mods

• html components

add info flash for holidays 2017

Currently, a file named ${product.slug}.html needs to be manually created, with only yaml front matter, for each product that should have a page.

Here's the idea to automate this:

• npm watch script
• when products.json changes, re-generate all files
• add this to npm start so that local development watches _data/*.json
• single source of truth = products.json

Re-order image optimization workflow via Feedback from junior web dev

#34 brought to light the fact that the strap option prices need to be as little hard coded into _includes/product-page.html as possible.

The data-item-custom1-options button property should interpolate each of the prices in the rendered string based on product.price, not hard coded values in the string.

Notify users and disable product buy button for 2018 holiday season.

Instead of having URL be a field in the CMS products, automatically generate it from the NAME.

I'd love to be able to (in order of my preference):

1. have a button that allows me to sort the list (alphabetically, chronologically, etc)
2. Automatically sort all products alphabetically (re-sorts on page refresh).