Jump to content

Shopify: Difference between revisions

From ZelocoreCMS Wiki
Publishing comprehensive CMS article
 
Full article: overview, features, Liquid/Hydrogen dev, Storefront+Admin API, pricing
 
Line 1: Line 1:
{{Community_Page}}
{{CMS_Infobox
{{CMS_Infobox
| name         = Shopify
| name           = Shopify
| status      = Community
| developer      = Shopify Inc.
| type         = E-commerce / SaaS / Headless CMS
| type           = eCommerce CMS / SaaS
| license     = Proprietary (SaaS)
| license       = Commercial (Proprietary)
| language     = Ruby (Backend), Liquid (Templating), React / TypeScript (Hydrogen)
| language       = Ruby on Rails (backend) / Liquid (themes)
| database    = MySQL / Redis / Spanner
| released      = 2006-06-01
| latest_ver  = SaaS (Continuous Deployment)
| latest_version = N/A (SaaS — continuously updated)
| release_date = June 2006
| website       = https://shopify.com
| website     = https://www.shopify.com
| github         = https://github.com/Shopify
| github       = https://github.com/Shopify
| stars          = N/A (SaaS)
| demo        = https://www.shopify.com
}}
}}


'''Shopify''' is a leading subscription-based Software-as-a-Service ([[SaaS CMS|SaaS]]) proprietary [[Category:E-commerce_CMS|e-commerce content management system]] that enables individuals and businesses to design, launch, and manage online stores across multiple sales channels. Headquartered in Ottawa, Ontario, Shopify powers millions of merchants in over 175 countries, processing hundreds of billions of dollars in global commerce volume annually.
'''Shopify''' is a leading cloud-based eCommerce platform that enables businesses of all sizes to create and manage online stores. Founded in Ottawa, Canada in 2006, Shopify powers over '''4 million stores''' in 175+ countries and processes hundreds of billions of dollars in merchant sales annually.
 
Unlike traditional open-source platforms like [[WordPress]] (with [[WooCommerce]]) or [[Drupal]] that require manual server configuration, hosting management, and security patches, Shopify operates as a fully managed cloud platform. It integrates storefront design, product catalog administration, payment processing, inventory tracking, order fulfillment, customer relationship management (CRM), and marketing analytics into a unified web-based admin interface.
 
In addition to serving small and medium-sized businesses (SMBs), Shopify caters to high-volume enterprise organizations through '''Shopify Plus''' and supports decoupled headless commerce architectures through its GraphQL Storefront API and modern React framework, '''Hydrogen'''.


== Overview ==
== Overview ==
Shopify serves as an all-in-one commercial infrastructure for modern online retail and multi-channel selling. The platform abstracts technical complexities such as web hosting infrastructure, database maintenance, network security, payment security compliance, and traffic scaling, allowing merchants to focus on branding, product sourcing, marketing, and customer acquisition.
Key characteristics of the Shopify platform include:
* '''Turnkey SaaS Infrastructure:''' Cloud-hosted platform offering high availability, zero server configuration, and automatic scaling during massive traffic spikes like Black Friday / Cyber Monday (BFCM).
* '''Multi-Channel Commerce:''' Native integration to sell across custom web storefronts, mobile apps, physical point-of-sale (POS) hardware, social media channels (Instagram, Facebook, TikTok), and online marketplaces (Amazon, eBay).
* '''Proprietary & Open Ecosystem:''' While the core backend and platform code are proprietary SaaS software, Shopify maintains an extensive open ecosystem for theme developers (using [[Liquid]]) and app developers (using REST and GraphQL APIs).
* '''Accelerated Checkout (Shop Pay):''' Proprietary one-click checkout system that stores customer payment and shipping info across the entire Shopify network, yielding up to 50% higher conversion rates compared to standard checkouts.
* '''Headless Capability:''' Complete separation of frontend presentation and backend logic via the Storefront API, enabling developers to build custom storefronts with modern JavaScript frameworks like [[React]], [[Next.js]], or Shopify's native [[Hydrogen]] framework.
== History ==
Shopify was founded in 2004 by Tobias Lütke, Daniel Weinand, and Scott Lake. The platform grew out of the founders' attempt to open an online snowboard store called ''Snowdevil''. Dissatisfied with existing e-commerce software options at the time—such as Miva Merchant, OsCommerce, or Yahoo! Stores—Lütke, a computer programmer by trade, decided to build a custom online store from scratch using the [[Ruby on Rails]] web framework.


After successfully launching Snowdevil, the founders recognized that other online merchants faced similar challenges. They refactored their custom e-commerce codebase into a standalone platform, officially launching Shopify in June 2006.
Shopify was founded by '''Tobias Lütke''' and partners who initially tried to build an online snowboard shop, only to find that existing eCommerce solutions were inadequate. They built their own platform, open-sourced the storefront framework, and launched Shopify as a product in 2006. The company went public on the NYSE in 2015.


Key historical milestones in Shopify's growth include:
Shopify is a '''fully hosted, all-in-one eCommerce solution''' — merchants get hosting, security, CDN, payment processing, and store management under one roof. This makes it particularly attractive for non-technical users who want to launch a store quickly without managing servers or software updates.


* '''2006 (Platform Launch):''' Official launch of Shopify as a subscription service for online storefront creation.
For developers, Shopify offers an extensive '''App Store''' with 10,000+ apps, a full REST and GraphQL Admin API, webhooks, custom theme development using the Liquid template language, and the Hydrogen framework for headless storefronts built with React.
* '''2009 (App Store & API):''' Launched the Shopify App Store and open API platform, allowing third-party developers to extend core functionality through custom applications.
* '''2010 (Mobile Apps & Theme Store):''' Released the Shopify Mobile app for iOS, allowing merchants to manage orders on mobile devices, alongside the official Shopify Theme Store.
* '''2013 (Shopify POS):''' Introduced Shopify Point of Sale (POS), enabling merchants to sync inventory and sales between physical brick-and-mortar retail stores and online storefronts.
* '''2015 (Initial Public Offering & Amazon Partnership):''' Shopify went public on the New York Stock Exchange (NYSE: SHOP) and Toronto Stock Exchange (TSX: SHOP). In the same year, Amazon closed its webstore platform for small merchants and recommended Shopify as its preferred migration partner.
* '''2017 (Shop Pay & Social Channels):''' Introduced Shop Pay (formerly Shopify Pay) for accelerated one-click checkout, along with native integrations for Instagram and Facebook social commerce.
* '''2021 (Online Store 2.0):''' Announced Online Store 2.0 (OS 2.0) at Shopify Unite, introducing section-based modular editing across all store templates, updated Liquid engine features, custom metafields, and developer tooling improvements.
* '''2022 (Hydrogen, Oxygen & Remix Acquisition):''' Launched Hydrogen (a React-based headless framework) and Oxygen (global edge hosting platform). Shopify also acquired Remix, a popular full-stack React framework, to power the next generation of Hydrogen.
* '''2023–Present (Commerce Components & Shopify Magic):''' Introduced Commerce Components for enterprise customization, embedded generative AI capabilities through Shopify Magic and Sidekick, and expanded B2B features natively into Shopify Plus.


== Key Features ==
== Key Features ==


=== Multi-Channel & Omnichannel Commerce ===
* '''Online Storefront''' — Fully hosted storefront with 100+ professional themes
Shopify centralizes inventory, customer profiles, and order processing across diverse sales channels. Merchants can list products and process transactions on:
* '''Shopify Payments''' — Built-in payment processing (2% fee waived vs third-party gateways)
* '''Web Storefronts:''' Customizable responsive desktop and mobile online stores.
* '''Point of Sale (POS)''' — Sell in-person with Shopify POS hardware and app
* '''Shopify POS:''' iOS and Android point-of-sale applications with specialized hardware (card readers, receipt printers, barcode scanners) for physical stores.
* '''Multi-channel Selling''' — Sell on Facebook, Instagram, TikTok, Amazon, eBay from one dashboard
* '''Social Commerce:''' Integrated product tagging, checkout, and storefronts on Instagram, Facebook, TikTok, and Pinterest.
* '''Inventory Management''' — Track stock across multiple locations, set low-stock alerts
* '''Marketplaces:''' Automated inventory and order synchronization with Amazon, eBay, and Walmart.
* '''Shopify Shipping''' — Discounted shipping rates with USPS, UPS, DHL
* '''Buy Buttons:''' Embeddable HTML snippets allowing merchants to add shopping cart capabilities to external websites, blogs, or email newsletters.
* '''Abandoned Cart Recovery''' — Automatic emails to recover abandoned carts
 
* '''Subscriptions''' — Sell recurring subscription products (via apps or Shopify Subscriptions)
=== Shopify Payments & Shop Pay ===
* '''Shopify Markets''' — Sell internationally with multi-currency, multi-language, local payment methods
Shopify Payments is the platform's native payment processing gateway, eliminating the need to configure third-party merchant accounts. Powered by [[Stripe]] infrastructure, Shopify Payments supports credit cards, debit cards, [[Apple Pay]], [[Google Pay]], and local payment methods.
* '''Shopify Hydrogen''' — React-based framework for headless storefronts
 
* '''Shop Pay:''' An accelerated checkout option that securely stores customer email, shipping address, and credit card details. When shopping at any store on the Shopify network, returning customers can complete purchases with a single tap or SMS verification code.
* '''Shop Pay Installments:''' Buy Now, Pay Later (BNPL) service integrated into checkout, allowing customers to split payments into equal interest-free installments.
 
=== Online Store 2.0 (OS 2.0) ===
Introduced in 2021, Online Store 2.0 overhauled Shopify's storefront architecture:
* '''Sections on Every Page:''' Allows non-technical merchants to add, remove, and reorder modular content sections across all page types (including Product detail pages, Collection pages, Cart, and Blog posts), rather than limiting sections to the homepage.
* '''Metafields & Custom Data:''' Built-in custom field definitions allowing merchants to add specialized structured data (e.g., size charts, material specs, care instructions, downloadable files) directly from the admin dashboard without plugins.
* '''JSON Templates:''' Replaced traditional Liquid page templates with structured JSON files (`product.json`, `collection.json`), defining section order and block settings dynamically.


=== Analytics & Reporting ===
== Installation ==
Shopify provides built-in reporting dashboards with real-time metric tracking:
* Sales performance breakdown by product, channel, geographic region, and staff member.
* Acquisition reporting analyzing customer traffic channels, referral source, and campaign performance.
* Conversion funnels tracking cart additions, checkout drop-off rates, and returning customer metrics.
* Custom reports and SQL-like analytics builder available on Advanced Shopify and Shopify Plus tiers.


=== Search Engine Optimization (SEO) & Marketing ===
Shopify is a '''SaaS platform''' — no installation is required. Getting started:
Out of the box, Shopify automates several technical SEO requirements:
* Automatic generation of XML sitemaps (`sitemap.xml`) and `robots.txt`.
* Standardized canonical URL tags to prevent duplicate content issues.
* Customizable title tags, meta descriptions, image alt text, and URL handles.
* Automated [[Schema.org]] structured data markup for products, pricing, and availability.
* Built-in blogging engine for content marketing and inbound lead generation.


=== Enterprise Capabilities (Shopify Plus) ===
=== Step 1: Create an Account ===
For enterprise organizations processing high transaction volume, Shopify Plus provides dedicated infrastructure and advanced capabilities:
* '''Custom Checkout:''' Customization of checkout workflows, fields, and branding using Checkout UI Extensions and Shopify Functions.
* '''Native B2B:''' Comprehensive business-to-business tools supporting wholesale price lists, volume discounts, net payment terms, customer company hierarchies, and custom B2B store layouts.
* '''Expansion Stores:''' Support for up to 9 expansion storefronts under a single agreement, facilitating international localization across multiple currencies, domains, and languages.
* '''Shopify Flow & Launchpad:''' E-commerce automation platforms to create event-triggered workflows (e.g., automatically tag VIP customers, unpublish out-of-stock items) and schedule promotional events (e.g., flash sales, holiday launches).


== Architecture ==
Visit [https://shopify.com/free-trial shopify.com] and start a free 3-day trial (then $1/month for 3 months on basic plans).
Shopify's core infrastructure is hosted on cloud computing platforms (primarily Google Cloud Platform) utilizing containerized microservices, distributed caching, and edge distribution networks. The backend architecture is built primarily on [[Ruby on Rails]], supported by high-performance data storage solutions such as MySQL, Redis, Memcached, and Google Cloud Spanner.


```
=== Step 2: Set Up Your Store ===
+-----------------------------------------------------------------------------------+
|                                  SHOPIFY ADMIN                                  |
|      (Product Catalog, Inventory, Customers, Orders, Analytics, Settings)        |
+-----------------------------------------------------------------------------------+
                                        |
    +-----------------------------------+-----------------------------------+
    |                                  |                                  |
    v                                  v                                  v
+------------------------+  +------------------------+  +-------------------------+
|    ADMIN REST API    |  |  ADMIN GRAPHQL API    |  |    STOREFRONT API      |
| (Management Logic)    |  | (Data Manipulation)    |  | (GraphQL Read/Checkout) |
+------------------------+  +------------------------+  +-------------------------+
            |                                                        |
            v                                                        v
+------------------------+                                +-------------------------+
|    LIQUID TEMPLATE    |                                |  HEADLESS FRONTENDS    |
|  STOREFRONT ENGINE    |                                |  (Hydrogen / React /    |
| (Online Store 2.0)    |                                |  Next.js / Mobile)    |
+------------------------+                                +-------------------------+
```


=== Liquid Template Engine ===
<syntaxhighlight lang="bash">
'''Liquid''' is an open-source, Ruby-based template language created by Tobias Lütke in 2006. It acts as the secure presentation layer for Shopify storefronts, rendering dynamic backend database objects into standard HTML, CSS, and JavaScript.
# No server setup needed. Access your admin at:
# https://YOUR-STORE.myshopify.com/admin
</syntaxhighlight>


Liquid enforces a strict separation of presentation logic from database modification; Liquid templates cannot execute raw Ruby code, alter server state, or query external databases directly.
=== Theme Development (Liquid) ===


Liquid markup consists of three primary constructs:
<syntaxhighlight lang="bash">
# Install Shopify CLI
npm install -g @shopify/cli @shopify/theme


==== 1. Objects (Output Tags) ====
# Authenticate
Objects output variable data to the page using double curly braces `{{ ... }}`:
shopify auth login --store your-store.myshopify.com
```liquid
<h1>{{ product.title }}</h1>
<p>Price: {{ product.price | money }}</p>
```


==== 2. Tags (Logic Tags) ====
# Download your theme for local development
Tags control template flow, loops, and conditional execution using curly brace percent syntax `{% ... %}`:
shopify theme pull
```liquid
{% if product.available %}
  <button type="submit">Add to Cart</button>
{% else %}
  <p>Out of Stock</p>
{% endif %}


{% for item in cart.items %}
# Start local development server
  <p>{{ item.product.title }} - Quantity: {{ item.quantity }}</p>
shopify theme dev
{% endfor %}
</syntaxhighlight>
```


==== 3. Filters (Data Manipulation) ====
=== Headless with Hydrogen (React) ===
Filters alter the output of variables, applied using the pipe character `|`:
```liquid
{{ product.title | upcase }}
{{ product.published_at | date: "%Y-%m-%d" }}
{{ product.description | truncate: 150 }}
```


=== APIs and Extensibility ===
<syntaxhighlight lang="bash">
Shopify exposes rich Application Programming Interfaces (APIs) for integrations and custom app development:
npm create @shopify/hydrogen@latest
* '''Admin API (REST & GraphQL):''' Provides full read-and-write access to backend resources such as products, inventory, customers, orders, and shop configuration. GraphQL is recommended for lower latency and query efficiency.
cd my-hydrogen-app
* '''Storefront API (GraphQL):''' Unauthenticated, read-only API designed for rendering custom store frontends, mobile applications, or IoT devices.
npm install
* '''Webhooks:''' Real-time event notifications dispatches payload JSON to external endpoints upon system triggers (e.g., `orders/create`, `products/update`, `customers/delete`).
npm run dev
# Visit http://localhost:3000
</syntaxhighlight>


== Themes ==
== API Reference ==
Themes dictate the design, visual layout, responsive behavior, and user experience of a Shopify online store. Themes are composed of Liquid files, JSON templates, CSS/Sass, JavaScript, and localized text files.


=== Standard Theme Directory Structure ===
Shopify provides REST and GraphQL Admin APIs plus a Storefront API.
A standard Online Store 2.0 theme adheres to the following directory convention:


```
=== Storefront API — Fetch Products ===
theme/
<syntaxhighlight lang="graphql">
├── assets/            # CSS stylesheets, JavaScript files, images, icons
query {
├── config/            # Theme settings configuration
   products(first: 10) {
│  ├── settings_data.json  # Active merchant setting values
    edges {
│  └── settings_schema.json # Admin theme editor setting definitions
      node {
├── layout/            # Master layout files wrapping pages
        id
│  └── theme.liquid    # Main container HTML file
        title
├── locales/            # Internationalization (i18n) translation files
        description
│  ├── en.default.json
        priceRange {
│  └── fr.json
          minVariantPrice {
├── sections/          # Reusable modular section templates
            amount
│  ├── header.liquid
            currencyCode
│  ├── hero-banner.liquid
          }
│  └── product-recommendations.liquid
        }
├── snippets/          # Reusable micro-templates included via {% render %}
        images(first: 1) {
│  └── price.liquid
          edges {
└── templates/          # JSON page template definitions
            node {
    ├── index.json
              url
    ├── product.json
              altText
    ├── collection.json
            }
    └── cart.json
          }
```
        }
 
       }
=== Sections and Blocks ===
Themes are structured around **Sections**—reusable, customizable layout modules. Each section contains a `{% schema %}` tag written in JSON format, which registers configurable options in the visual Shopify Theme Editor.
 
Example section schema definition:
```liquid
<div class="custom-banner">
   <h2>{{ section.settings.heading }}</h2>
</div>
 
{% schema %}
{
  "name": "Custom Banner",
  "settings": [
    {
      "type": "text",
      "id": "heading",
      "label": "Banner Heading",
      "default": "Welcome to our store!"
    }
  ],
  "presets": [
    {
       "name": "Custom Banner"
     }
     }
   ]
   }
}
}
{% endschema %}
</syntaxhighlight>
```


=== Theme Development Workflow ===
=== JavaScript (Storefront API) ===
Developers customize or construct themes locally using the official **Shopify CLI**. Tools like `shopify theme dev` spawn a local development server with real-time hot reloading and live synchronization with a Shopify sandbox development store.
<syntaxhighlight lang="javascript">
import { createStorefrontClient } from '@shopify/storefront-api-client';


== Apps Ecosystem ==
const client = createStorefrontClient({
The **Shopify App Store** (`apps.shopify.com`) hosts over 8,000 commercial and free applications that extend storefront capabilities, backend workflows, marketing automation, logistics, and analytics.
  storeDomain: 'your-store.myshopify.com',
  publicStorefrontToken: 'YOUR_STOREFRONT_TOKEN',
  apiVersion: '2024-01',
});


=== App Types ===
const { data } = await client.request(`
* '''Public Apps:''' Listed on the official Shopify App Store or unlisted; available to any merchant for installation via OAuth 2.0 authentication.
  query { shop { name primaryDomain { url } } }
* '''Custom Apps:''' Developed specifically for a single merchant's store to connect bespoke back-office systems, custom ERPs, or proprietary logistics solutions.
`);
console.log(data.shop.name);
</syntaxhighlight>


=== App Framework & Developer Standards ===
=== Admin API — Create Product ===
Modern Shopify apps are built using standard web technologies (Node.js, Python, Ruby, Go, React) and integrate seamlessly into the Shopify Admin using:
<syntaxhighlight lang="bash">
* '''Shopify App Bridge:''' A JavaScript library that embeds app user interfaces directly inside the Shopify Admin, ensuring consistent visual navigation and seamless iframe integration.
curl -X POST https://your-store.myshopify.com/admin/api/2024-01/products.json  -H "X-Shopify-Access-Token: YOUR_ACCESS_TOKEN"  -H "Content-Type: application/json"  -d '{
* '''Polaris Design System:''' Shopify's official component library and design guidelines for building accessible, brand-consistent admin user interfaces.
    "product": {
* '''Theme App Extensions:''' Modular **App Blocks** and **Embed Blocks** that allow apps to inject storefront markup and scripts cleanly into Online Store 2.0 themes without modifying theme Liquid code directly, simplifying app installation and clean uninstallation.
      "title": "My Product",
      "body_html": "<p>Product description</p>",
      "vendor": "My Brand",
      "product_type": "T-Shirts",
      "variants": [{"price": "29.99", "sku": "SKU001"}]
    }
  }'
</syntaxhighlight>


== Headless Shopify (Hydrogen) ==
== Pricing ==
As enterprise e-commerce demands grow, many merchants adopt a **headless commerce** architecture—decoupling the backend commerce engine from the frontend user interface.


=== Storefront API ===
{| class="wikitable"
Shopify supports headless architectures via the **Storefront API**, a high-performance GraphQL API that exposes storefront capabilities including product query search, collection filtering, customer login, cart creation, and checkout initiation.
! Plan !! Monthly Price !! Transaction Fee !! Best For
|-
| Basic || $39/month || 2% (waived with Shopify Payments) || New stores
|-
| Shopify || $105/month || 1% || Growing stores
|-
| Advanced || $399/month || 0.5% || Scaling stores
|-
| Shopify Plus || From $2,300/month || 0.15–0.25% || Enterprise
|-
| Starter || $5/month || 5% || Social selling only
|}


=== Hydrogen Framework ===
{{Note|All plans include a 3-day free trial. Shopify Payments eliminates transaction fees on all plans.}}
'''Hydrogen''' is Shopify's official open-source frontend web framework built for fast, custom headless commerce. Key characteristics include:
* Built on top of [[React]] and the [[Remix]] full-stack web framework.
* Leverages React Server Components (RSC) for fast server-side rendering, streaming HTML delivery, and reduced client JavaScript bundle sizes.
* Pre-built commerce components, custom React hooks (e.g., `useCart`, `useShopQuery`), and utilities for interacting with Shopify's Storefront API.


=== Oxygen Edge Hosting ===
== Pros & Cons ==
'''Oxygen''' is Shopify's global edge hosting platform designed specifically for Hydrogen applications. Integrated directly into the Shopify admin, Oxygen deploys Hydrogen apps across dozens of global edge server locations with built-in CDN caching, sub-second TTFB (Time to First Byte), zero infrastructure configuration, and automatic SSL security.


== Pricing and Hosting Model ==
{| class="wikitable"
Shopify operates strictly on a hosted Software-as-a-Service model. All subscription plans include cloud web hosting, unmetered bandwidth, global CDN delivery, automated SSL certificates, Level 1 PCI-DSS security compliance, and 24/7 technical support.
! ✅ Pros !! ❌ Cons
 
|-
=== Subscription Tiers ===
| Easiest setup for non-technical users || Monthly fees are ongoing costs
* '''Shopify Starter:''' Lightweight plan for selling products via messaging apps or social links without a full online store.
|-
* '''Basic Shopify:''' Designed for solo entrepreneurs and new online stores; includes full storefront, 2 staff accounts, and basic analytics.
| 10,000+ apps in App Store || Transaction fees if not using Shopify Payments
* '''Shopify:''' Standard plan for growing businesses; includes 5 staff accounts, professional reports, and reduced credit card transaction rates.
* '''Advanced Shopify:''' Targeted at scaling businesses requiring up to 15 staff accounts, custom report builder, and duty/import tax calculations.
* '''Shopify Plus:''' Enterprise subscription tier starting at $2,000/month for high-volume retailers, providing dedicated account management, custom checkout control, 9 expansion stores, and B2B capabilities.
 
=== Transaction Fees ===
When using '''Shopify Payments''', merchants pay standard credit card processing rates without additional platform transaction fees. If a merchant opts to use a third-party payment gateway (e.g., external PayPal, Authorize.net, CyberSource), Shopify charges an additional platform fee ranging from 0.15% to 2.0% based on the subscription tier.
 
== Comparison ==
The following table provides a comparison between Shopify and other prominent e-commerce platforms:
 
{| class="wikitable sortable" style="width:100%;"
! Platform !! Hosting Model !! Primary Language / Stack !! Technical Complexity !! Ecosystem / Extensions !! Target Audience
|-
|-
| '''[[Shopify]]''' || Hosted SaaS || Ruby on Rails, Liquid, React (Hydrogen) || Low to Medium || 8,000+ Apps || SMBs to High-Volume Enterprise
| Built-in payment processing || Limited customization vs open-source
|-
|-
| '''[[WooCommerce]]''' (for [[WordPress]]) || Self-Hosted / Open-Source || PHP, MySQL || Medium || 60,000+ Plugins || Independent Businesses & Agencies
| 24/7 support on all plans || App costs add up quickly
|-
|-
| '''[[Magento]]''' (Adobe Commerce) || Self-Hosted or Cloud PaaS || PHP, MySQL, Knockout.js || High || 4,000+ Modules || Large Enterprises & Custom Retailers
| Excellent multi-channel selling || Liquid template language has learning curve
|-
|-
| '''[[BigCommerce]]''' || Hosted SaaS || PHP, Stencil, Handlebars || Low to Medium || 1,000+ Apps || Mid-Market & Enterprise Retailers
| Shopify Payments in 20+ countries || Locked into Shopify ecosystem
|-
|-
| '''[[Squarespace]]''' || Hosted SaaS || Java, Node.js, JSON-T || Low || Native Integrations || Photographers, Artists & Micro-Stores
| Hydrogen for headless storefronts || Export data is cumbersome
|}
|}
== Community & Support ==
* '''Help Center:''' [https://help.shopify.com Shopify Help Center]
* '''Developer Docs:''' [https://shopify.dev Shopify Dev Documentation]
* '''Community Forum:''' [https://community.shopify.com Shopify Community]
* '''Partners Program:''' [https://www.shopify.com/partners Shopify Partners] for agencies and developers
* '''Changelog:''' [https://shopify.dev/changelog Shopify API Changelog]
== See Also ==
* [[WooCommerce]] — Self-hosted WordPress eCommerce
* [[:Category:ECommerce_CMS|eCommerce CMS platforms]]
* [[:Category:SaaS_CMS|SaaS CMS platforms]]


== External Links ==
== External Links ==
* [https://www.shopify.com Official Shopify Website]
 
* [https://shopify.dev Shopify Developer Documentation]
* [https://shopify.com Official Website]
* [https://shopify.github.io/liquid/ Official Liquid Template Documentation]
* [https://shopify.dev Developer Documentation]
* [https://hydrogen.shopify.dev Hydrogen Framework Documentation]
* [https://github.com/Shopify GitHub Organization]
* [https://apps.shopify.com Shopify App Store]
* [https://apps.shopify.com App Store]
* [https://themes.shopify.com Shopify Theme Store]
* [https://github.com/Shopify Shopify GitHub Organization]


[[Category:CMS_Platforms]]
[[Category:CMS_Platforms]]
[[Category:E-commerce_CMS]]
[[Category:ECommerce_CMS]]
[[Category:SaaS_CMS]]
[[Category:SaaS_CMS]]
[[Category:Headless_CMS]]

Latest revision as of 22:20, 29 July 2026


Shopify
Status 🤝 Community
Type eCommerce CMS / SaaS
License Commercial (Proprietary)
Language Ruby on Rails (backend) / Liquid (themes)
Database
Latest Version
Release Date
Website Official Site
GitHub Repository

Shopify is a leading cloud-based eCommerce platform that enables businesses of all sizes to create and manage online stores. Founded in Ottawa, Canada in 2006, Shopify powers over 4 million stores in 175+ countries and processes hundreds of billions of dollars in merchant sales annually.

Overview

Shopify was founded by Tobias Lütke and partners who initially tried to build an online snowboard shop, only to find that existing eCommerce solutions were inadequate. They built their own platform, open-sourced the storefront framework, and launched Shopify as a product in 2006. The company went public on the NYSE in 2015.

Shopify is a fully hosted, all-in-one eCommerce solution — merchants get hosting, security, CDN, payment processing, and store management under one roof. This makes it particularly attractive for non-technical users who want to launch a store quickly without managing servers or software updates.

For developers, Shopify offers an extensive App Store with 10,000+ apps, a full REST and GraphQL Admin API, webhooks, custom theme development using the Liquid template language, and the Hydrogen framework for headless storefronts built with React.

Key Features

  • Online Storefront — Fully hosted storefront with 100+ professional themes
  • Shopify Payments — Built-in payment processing (2% fee waived vs third-party gateways)
  • Point of Sale (POS) — Sell in-person with Shopify POS hardware and app
  • Multi-channel Selling — Sell on Facebook, Instagram, TikTok, Amazon, eBay from one dashboard
  • Inventory Management — Track stock across multiple locations, set low-stock alerts
  • Shopify Shipping — Discounted shipping rates with USPS, UPS, DHL
  • Abandoned Cart Recovery — Automatic emails to recover abandoned carts
  • Subscriptions — Sell recurring subscription products (via apps or Shopify Subscriptions)
  • Shopify Markets — Sell internationally with multi-currency, multi-language, local payment methods
  • Shopify Hydrogen — React-based framework for headless storefronts

Installation

Shopify is a SaaS platform — no installation is required. Getting started:

Step 1: Create an Account

Visit shopify.com and start a free 3-day trial (then $1/month for 3 months on basic plans).

Step 2: Set Up Your Store

# No server setup needed. Access your admin at:
# https://YOUR-STORE.myshopify.com/admin

Theme Development (Liquid)

# Install Shopify CLI
npm install -g @shopify/cli @shopify/theme

# Authenticate
shopify auth login --store your-store.myshopify.com

# Download your theme for local development
shopify theme pull

# Start local development server
shopify theme dev

Headless with Hydrogen (React)

npm create @shopify/hydrogen@latest
cd my-hydrogen-app
npm install
npm run dev
# Visit http://localhost:3000

API Reference

Shopify provides REST and GraphQL Admin APIs plus a Storefront API.

Storefront API — Fetch Products

query {
  products(first: 10) {
    edges {
      node {
        id
        title
        description
        priceRange {
          minVariantPrice {
            amount
            currencyCode
          }
        }
        images(first: 1) {
          edges {
            node {
              url
              altText
            }
          }
        }
      }
    }
  }
}

JavaScript (Storefront API)

import { createStorefrontClient } from '@shopify/storefront-api-client';

const client = createStorefrontClient({
  storeDomain: 'your-store.myshopify.com',
  publicStorefrontToken: 'YOUR_STOREFRONT_TOKEN',
  apiVersion: '2024-01',
});

const { data } = await client.request(`
  query { shop { name primaryDomain { url } } }
`);
console.log(data.shop.name);

Admin API — Create Product

curl -X POST https://your-store.myshopify.com/admin/api/2024-01/products.json   -H "X-Shopify-Access-Token: YOUR_ACCESS_TOKEN"   -H "Content-Type: application/json"   -d '{
    "product": {
      "title": "My Product",
      "body_html": "<p>Product description</p>",
      "vendor": "My Brand",
      "product_type": "T-Shirts",
      "variants": [{"price": "29.99", "sku": "SKU001"}]
    }
  }'

Pricing

Plan Monthly Price Transaction Fee Best For
Basic $39/month 2% (waived with Shopify Payments) New stores
Shopify $105/month 1% Growing stores
Advanced $399/month 0.5% Scaling stores
Shopify Plus From $2,300/month 0.15–0.25% Enterprise
Starter $5/month 5% Social selling only
ℹ️ All plans include a 3-day free trial. Shopify Payments eliminates transaction fees on all plans.

Pros & Cons

✅ Pros ❌ Cons
Easiest setup for non-technical users Monthly fees are ongoing costs
10,000+ apps in App Store Transaction fees if not using Shopify Payments
Built-in payment processing Limited customization vs open-source
24/7 support on all plans App costs add up quickly
Excellent multi-channel selling Liquid template language has learning curve
Shopify Payments in 20+ countries Locked into Shopify ecosystem
Hydrogen for headless storefronts Export data is cumbersome

Community & Support

See Also