Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
C4DI Presentation: The Shopify Economy
Search
Keir Whitaker
July 31, 2014
Technology
1
320
C4DI Presentation: The Shopify Economy
Keir Whitaker
July 31, 2014
Tweet
Share
More Decks by Keir Whitaker
See All by Keir Whitaker
DotYork Workshop
keirwhitaker
0
67
Grow your web design business with the Shopify Partner Program
keirwhitaker
1
230
A Pragmatists Guide to Making your Side Projects Pay
keirwhitaker
3
160
Shopify for Designers Workshop
keirwhitaker
1
110
An Afternoon with Shopify - Brooklyn, October 2013
keirwhitaker
0
64
Building Online Businesses
keirwhitaker
0
94
From side project to business (is easier than you think)
keirwhitaker
0
76
Other Decks in Technology
See All in Technology
[VPoE Global Summit] サービスレベル目標による信頼性への投資最適化
satos
0
210
From Natural Language to K8s Operations: The MCP Architecture and Practice of kubectl-ai
appleboy
0
110
「魔法少女まどか☆マギカ Magia Exedra」のIPのキャラクターを描くための3Dルック開発
gree_tech
PRO
0
150
AI AgentをLangflowでサクッと作って、1日働かせてみた!
yano13
1
130
SCONE - 動画配信の帯域を最適化する新プロトコル
kazuho
1
320
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
940
[OCI Skill Mapping] AWSユーザーのためのOCI – IaaS編(Compute/Storage/Networking) (2025年10月8日開催)
oracle4engineer
PRO
1
180
Digitization部 紹介資料
sansan33
PRO
1
5.6k
「魔法少女まどか☆マギカ Magia Exedra」におけるバックエンドの技術選定
gree_tech
PRO
0
110
「タコピーの原罪」から学ぶ間違った”支援” / the bad support of Takopii
piyonakajima
0
120
今この時代に技術とどう向き合うべきか
gree_tech
PRO
2
2.1k
Building a cloud native business on open source
lizrice
0
170
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Building a Modern Day E-commerce SEO Strategy
aleyda
44
7.8k
Automating Front-end Workflow
addyosmani
1371
200k
A better future with KSS
kneath
239
18k
Music & Morning Musume
bryan
46
6.9k
We Have a Design System, Now What?
morganepeng
53
7.8k
Testing 201, or: Great Expectations
jmmastey
45
7.7k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.9k
Transcript
Shopify for Designers - Hull 31.07.2014 / @shopify / #shopifyu
@keirwhitaker
[email protected]
keirwhitaker.com
What is Shopify?
Theme based hosted ecommerce platform 100% Free to Use for
designers 110,000+ stores
Fully hosted easy to use ecommerce platform
Point of Sale & Payments
Features
Auto image resizing Navigation lists CDN for all assets Page
& product templates Redirect module Discount engine Gift cards 24/7 Support
Partners & Experts
Unlimited Dev Shops 20% Revenue Share Partner Forums Help &
Support Lead Generation
Shopify Experts
Theme & App Store
shopify.com/themes
shopify.com/apps
Themes: 80/20 ! Apps: 70/30
Example Stores
A Book Apart
United Pixel Workers
Greats Brand
Pure Fix Cycles
Best Made Co.
Hard Graft
Hiut Denim
Herb Lester
Key Concepts
Products
None
Collections
purefixcycles.com/collections
purefixcycles.com/collections/50mm-wheelsets
A Quick Theme Intro
HTML CSS JS Liquid Templates
assets -- site.css.liquid -- site.js.liquid config layout -- theme.liquid snippets
-- footer.liquid -- header.liquid templates -- 404.liquid -- article.liquid -- blog.liquid -- cart.liquid -- collection.liquid -- index.liquid -- list-collections.liquid -- page.liquid -- product.liquid -- search.liquid
/thisisntarealurl → 404.liquid /blogs/<blog-name>/<article-id-handle> → article.liquid /blogs/<blog-name> → blog.liquid /cart
→ cart.liquid /collections → list-collections.liquid /collections/<collection-handle> → collection.liquid /collections/<collection-handle>/<tag> → collection.liquid / → index.liquid /pages/<page-handle> → page.liquid /products → list-collections.liquid /products/<product-handle> → product.liquid /search?q=<search-term> → search.liquid
Liquid
Output ! {{ product.title }} ! {{ product.description }} !
{{ product.handle }}
Filters ! {{ product.title | upcase }} ! {{ 'logo.png'
| asset_url | img_tag: 'Site Logo' }} ! {{ 'capitalize me' | capitalize }} ! {{ article.published_at | date: "%a, %b %d, %y" }} ! {{ 'style.css' | asset_url | stylesheet_tag }}
Logic ! {% if product.available %} Show Add to cart
button here {% else %} Display message! {% endif %}
Loops ! {% for image in product.images %} <img src="{{
image | product_img_url: 'medium' }}" /> {% endfor %}
Thank You - Questions?
[email protected]
/ @keirwhitaker