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
270
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
48
Grow your web design business with the Shopify Partner Program
keirwhitaker
1
230
A Pragmatists Guide to Making your Side Projects Pay
keirwhitaker
3
150
Shopify for Designers Workshop
keirwhitaker
1
100
An Afternoon with Shopify - Brooklyn, October 2013
keirwhitaker
0
59
Building Online Businesses
keirwhitaker
0
82
From side project to business (is easier than you think)
keirwhitaker
0
71
Other Decks in Technology
See All in Technology
BLADE: An Attempt to Automate Penetration Testing Using Autonomous AI Agents
bbrbbq
0
310
OCI Security サービス 概要
oracle4engineer
PRO
0
6.5k
AWS Lambda のトラブルシュートをしていて思うこと
kazzpapa3
2
180
AIチャットボット開発への生成AI活用
ryomrt
0
170
Can We Measure Developer Productivity?
ewolff
1
150
Terraform CI/CD パイプラインにおける AWS CodeCommit の代替手段
hiyanger
1
240
アジャイルでの品質の進化 Agile in Motion vol.1/20241118 Hiroyuki Sato
shift_evolve
0
160
Introduction to Works of ML Engineer in LY Corporation
lycorp_recruit_jp
0
130
Amazon CloudWatch Network Monitor のススメ
yuki_ink
1
210
Platform Engineering for Software Developers and Architects
syntasso
1
520
安心してください、日本語使えますよ―Ubuntu日本語Remix提供休止に寄せて― 2024-11-17
nobutomurata
1
1k
エンジニア人生の拡張性を高める 「探索型キャリア設計」の提案
tenshoku_draft
1
130
Featured
See All Featured
Building Flexible Design Systems
yeseniaperezcruz
327
38k
Mobile First: as difficult as doing things right
swwweet
222
8.9k
Producing Creativity
orderedlist
PRO
341
39k
Build The Right Thing And Hit Your Dates
maggiecrowley
33
2.4k
Writing Fast Ruby
sferik
627
61k
Code Review Best Practice
trishagee
64
17k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
Making Projects Easy
brettharned
115
5.9k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
4
370
4 Signs Your Business is Dying
shpigford
180
21k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
126
18k
YesSQL, Process and Tooling at Scale
rocio
169
14k
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