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
310
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
65
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
92
From side project to business (is easier than you think)
keirwhitaker
0
75
Other Decks in Technology
See All in Technology
ソフトウェアテストのAI活用_ver1.25
fumisuke
1
260
PO初心者が考えた ”POらしさ”
nb_rady
0
220
Glacierだからってコストあきらめてない? / JAWS Meet Glacier Cost
taishin
1
170
データ基盤からデータベースまで?広がるユースケースのDatabricksについて教えるよ!
akuwano
3
140
Delta airlines®️ USA Contact Numbers: Complete 2025 Support Guide
airtravelguide
0
340
Getting to Know Your Legacy (System) with AI-Driven Software Archeology (WeAreDevelopers World Congress 2025)
feststelltaste
1
160
Claude Code に プロジェクト管理やらせたみた
unson
6
4.6k
AI エージェントと考え直すデータ基盤
na0
17
5.6k
AWS CDK 入門ガイド これだけは知っておきたいヒント集
anank
3
300
United Airlines Customer Service– Call 1-833-341-3142 Now!
airhelp
0
170
React開発にStorybookとCopilotを導入して、爆速でUIを編集・確認する方法
yu_kod
1
300
敢えて生成AIを使わないマネジメント業務
kzkmaeda
2
470
Featured
See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
6
310
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
740
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
2.9k
Writing Fast Ruby
sferik
628
62k
The Cost Of JavaScript in 2023
addyosmani
51
8.5k
Producing Creativity
orderedlist
PRO
346
40k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Fireside Chat
paigeccino
37
3.5k
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