Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Purelane — Shopify Dawn-Architecture Theme

A Shopify Online Store 2.0 implementation of the supplied Purelane homepage reference.

What is included

  • Purelane visual direction retained from the supplied HTML reference.
  • Responsive hero, animated water background, product rotator, section rail, reviews, bundles, shop shelf, trust bar, newsletter and sticky CTA.
  • Shopify-native Liquid and JSON templates.
  • Header and footer moved into Shopify section groups so they are managed separately from the homepage.
  • JSON homepage template with a reusable purelane-homepage section.
  • Product, collection, cart, search, page and 404 templates.
  • Native product forms using Shopify cart/product routes.
  • Collection-driven product cards in the bestseller shelf.
  • Newsletter form wired through Shopify's customer form.
  • Search, account and cart navigation wired to Shopify routes.
  • Theme settings and section presets for Online Store 2.0 editor compatibility.
  • Accessibility-minded skip link, labels and reduced-motion behavior retained.

Theme structure

assets/
  purelane.css
  purelane.js
config/
  settings_schema.json
  settings_data.json
layout/
  theme.liquid
sections/
  header-group.json
  footer-group.json
  purelane-header.liquid
  purelane-footer.liquid
  purelane-homepage.liquid
  main-product.liquid
  main-collection.liquid
  main-cart.liquid
  main-search.liquid
  main-page.liquid
  main-404.liquid
snippets/
  purelane-product-form.liquid
templates/
  index.json
  product.json
  collection.json
  cart.json
  search.json
  page.json
  list-collections.json
  404.json

Setup

  1. Create or open a Shopify development store.
  2. Add the products used by the assignment to a collection.
  3. Upload this theme from Online Store → Themes → Add theme → Upload zip file.
  4. Open Customize and select the Purelane homepage.
  5. Set the product collection in the Purelane homepage section.
  6. Preview desktop and mobile layouts before publishing.

Important implementation note

The original assignment supplied a standalone HTML homepage. This project converts that visual reference into Shopify's Online Store 2.0 architecture rather than leaving it as a static HTML page. The homepage is a JSON template, the site chrome is represented as section groups, and reusable functionality is implemented through Liquid sections/snippets.

The current package follows Dawn/Online Store 2.0 conventions and is intentionally kept self-contained for the assignment. It does not vendor the full upstream Dawn repository or claim to be an unmodified copy of Dawn.

Submission checklist

  • Product collection assigned in Theme Editor.
  • Product images/prices/variants populated in Shopify admin.
  • Homepage checked on desktop.
  • Homepage checked on mobile.
  • Add-to-cart tested.
  • Cart and checkout flow tested.
  • Search tested.
  • Newsletter signup tested.
  • No placeholder links remain where the assignment expects live Shopify destinations.

Preview note

The header home/brand links use routes.root_url so the homepage can be reached correctly even when the Theme Editor is previewing the 404 template.

Validation fixes

  • Removed unsupported default from the collection section setting.
  • Added valid theme settings schema entries.
  • Added explicit header subtitle setting.
  • Homepage JSON template uses an alphanumeric section ID.

About

Shopify theme implementation for the Purelane AI Product Engineer Assignment

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages