Bagian Theme Store selesai di 73 Sukses di Theme Store. Dua bab terakhir buku ini soal alat yang udah deprecated: Shopify CLI 2.x (bab ini) dan Theme Kit (75 Theme Kit (deprecated)). Kenapa masih dibahas? Karena tutorial, artikel blog, jawaban forum, dan repo theme lama penuh dengan shopify login, shopify theme serve, dan shopify populate, dan kamu perlu bisa nerjemahinnya ke CLI 3.x dari 05 Shopify CLI tanpa bingung. Pesannya jelas dari Shopify: kecuali diinstruksikan khusus, pakai CLI 3.0+. CLI 2.x deprecated dan gak didukung lagi.

Apa itu CLI 2.x

Shopify CLI 2.x adalah alat command-line berbasis Ruby (gem shopify-cli) yang dulu dipakai buat bikin theme dan app: dia bisa nge-generate app Node.js, Ruby on Rails, dan PHP, app extension, dan theme, plus ngotomatisasi tugas pengembangan umum. Buat theme, fiturnya:

  • Preview, tes, dan bagikan perubahan dengan aman lewat development theme.
  • Hot reload CSS dan section, atau refresh otomatis halaman waktu file berubah.
  • Inisialisasi theme baru dengan Dawn sebagai titik awal (sekarang Skeleton, 02 Bikin Theme Baru dari Skeleton).
  • Push dan publish theme dari command line.
  • Jalanin Theme Check.
  • Ngisi data uji (produk, pelanggan, draft order) ke toko, fitur yang hilang di 3.x.

Bisa dipakai bareng GitHub integration (08 GitHub Integration dan Version Control).

1. Development Theme

Konsepnya sama persis dengan 3.x (05 Shopify CLI > Development Theme): theme sementara dan tersembunyi yang terhubung ke toko pengembangan, bikin kamu bisa pakai data toko itu buat tes lokal. Dibikin lewat shopify theme serve, bisa di toko biasa atau dev store, gak dihitung ke batas theme, dan dihapus setelah tujuh hari gak aktif. Perbedaan penting: CLI 2.x ngehapus development theme waktu kamu shopify logout, jadi kalau butuh link preview yang tetap hidup setelah logout, push ke theme unpublished dulu. Kegunaannya: lihat perubahan real-time, kustomisasi lewat theme editor, bagikan preview berpassword ke developer lain.

2. Struktur Folder

Perintah tertentu seperti shopify theme serve cuma bisa jalan kalau folder-nya cocok dengan struktur theme standar, yaitu theme tanpa build step, atau theme yang udah melewati transformasi file (54 Best Practices Umum). Kalau kamu pakai build tool, jalanin perintahnya dari folder yang berisi file hasil generate. Strukturnya, perhatiin belum ada blocks/ karena theme block belum lahir di era ini:

└── project
    ├── assets
    ├── config
    ├── layout
    ├── locales
    ├── sections
    ├── snippets
    └── templates
        └── customers

3. .shopifyignore

File yang gak mau disentuh CLI ditaruh di .shopifyignore di root theme, sama seperti 3.x (05 Shopify CLI > Ngecualiin File): nama file (templates/product.temp.json), wildcard (config/*_secret.json, *.jpg), atau regex (/\.(txt|gif|bat)$/). Flag --ignore di push/pull juga bisa, dan kalau keduanya ada, keduanya dihormati.

Referensi Perintah

Bedanya dengan 3.x yang paling kelihatan: 2.x punya perintah level atas buat sesi (login, logout, store, switch, whoami, populate) yang gak ada di 3.x, dan argumen folder ditulis sebagai posisi [ROOT], bukan --path.

1. init

Nyalin repository Git sebagai titik awal theme. Tanpa repository, yang disalin Dawn dengan nama yang diberikan; tanpa nama, kamu ditanya:

shopify theme init [ NAME ] [ options ]

NAME jadi nama folder; --clone-url / -u URL repo (default https://github.com/Shopify/dawn.git).

2. serve

Padanan shopify theme dev. Upload theme saat ini sebagai theme tertentu atau development theme ke toko yang terhubung, dan ngembaliin: link development theme di http://127.0.0.1:9292 yang bisa hot reload CSS dan section atau refresh seluruh halaman; link editor di admin; dan preview link yang bisa dibagikan. Kalau udah ada development theme di environment itu, serve menggantikannya dengan theme lokal, kecuali pakai --theme-editor-sync. Kustomisasi checkout gak bisa dipreview lewat 127.0.0.1:9292. Development theme dihapus waktu logout.

shopify theme serve [ ROOT ] [ options ]

Flag:

  • --live-reload: hot-reload (default, CSS dan section), full-page (refresh halaman), off.
  • --host (default 127.0.0.1) dan --port.
  • --poll: paksa adapter polling buat mantau perubahan file, coba kalau live reload gak jalan.
  • --theme-editor-sync / -e: sinkronisasi dua arah file JSON theme; perubahan di theme editor diterapin ke salinan lokal. Kalau udah ada development theme, lokal dan remote dibandingkan, file yang beda dilistir, dan kamu diminta nimpa lokal, nimpa remote, atau merge.
  • --theme / -t: ID atau nama theme yang di-serve; tanpa ini dipakai development theme.
  • --ignore / -x dan --only / -o: pola file yang dilewatin atau cuma yang di-hot-reload, bisa diulang, format nama file / wildcard / regex (/\.jpe?g$/, mungkin butuh escape tambahan di shell). Kalau file cocok keduanya, diabaikan.

3. check

Jalanin Theme Check (65 Theme Check Pengenalan, Konfigurasi, Commands):

shopify theme check [ ROOT ] [ options ]

Flag (tiap flag punya environment variable SHOPIFY_FLAG_*): --config / -C path config kustom yang menimpa .theme-check.yml; --fail-level severity yang bikin exit code 1, nilainya error, suggestion, style (nama severity 1.x, yang di 2.x jadi error/warning/info, lihat 65 Theme Check Pengenalan, Konfigurasi, Commands > Migrasi dari Theme Check 1.x ke 2.x); --auto-correct / -a; --init bikin config baru; --output / -o json atau text; --print config aktif ke STDOUT; --list / -l daftar check aktif; --environment / -e; --version / -v; --path; --verbose.

4. list, open

shopify theme list nampilin theme di toko dengan ID dan status. shopify theme open [ options ] ngembaliin link editor dan preview theme; tanpa --theme kamu diminta milih. Flag: --theme / -t nama atau ID; --live / -l theme yang tayang; --development / -d development theme; --editor / -e langsung buka theme editor di browser.

5. pull

shopify theme pull [ ROOT ] [ options ]

Flag: --theme / -t; --live / -l; --development / -d (download dari development theme remote, misalnya buat nyalin perubahan yang dibikin di theme editor ke lokal); --nodelete / -n tarik tanpa ngehapus file lokal; --ignore / -x dan --only / -o dengan format pola yang sama.

6. push

Upload file lokal ke Shopify, nimpa theme remote kalau disebut; tanpa --theme kamu diminta milih. Ngembaliin link editor dan preview. Dengan --json, info theme dikembaliin sebagai JSON buat script atau CI:

shopify theme push --unpublished --json
{
"theme": {
  "id": 108267175958,
  "name": "MyTheme",
  "role": "unpublished",
  "shop": "mystore.myshopify.com",
  "editor_url": "https://mystore.myshopify.com/admin/themes/108267175958/editor",
  "preview_url": "https://mystore.myshopify.com/?preview_theme_id=108267175958"
}
}

Flag: --theme / -t; --development / -d (bikin development theme kalau belum ada); --nodelete / -n push tanpa ngehapus file remote; --json / -j; --allow-live / -a izinin nimpa theme yang tayang; --live / -l push ke theme tayang (gak butuh --theme atau --allow-live); --publish / -p publish setelah push; --unpublished / -u upload sebagai theme unpublished baru (nama ditanya, atau lewat --theme); --ignore / -x; --only / -o.

Pola pakai yang aman di era itu, dan masih berlaku di 3.x:

❌ nimpa theme yang tayang tanpa sengaja

shopify theme push --live

✅ push ke theme unpublished, cek preview-nya, baru publish

shopify theme push --unpublished --theme "Release 2.1.0"
shopify theme publish 108267175958

7. share, publish, package, delete

shopify theme share [ ROOT ] upload theme sebagai theme unpublished baru dengan nama acak dan ngembaliin preview link. shopify theme publish [ THEME_ID ] [ --force | -f ] mem-publish theme unpublished dari library, dengan konfirmasi kecuali --force; theme lokal harus di-push dulu. shopify theme package [ ROOT ] ngebungkus folder yang cocok struktur standar jadi ZIP bernama theme_name-theme_version.zip dari settings_schema.json. shopify theme delete { THEME_ID [ ... ] | --development, -d } [ --force | -f ] ngehapus satu atau beberapa theme (ID dipisah spasi) atau development theme, dengan konfirmasi kecuali --force.

8. help, version, config

shopify help, shopify -h, shopify --help, dan shopify help [command] / shopify [command] -h. shopify version nampilin versi (misalnya 1.6.0). shopify config analytics [ --status | --enable | --disable ] ngatur pelaporan penggunaan anonim (3.x pakai SHOPIFY_CLI_NO_ANALYTICS=1), dan shopify config feature [ feature_name ] [ --status | --enable | --disable ] buat feature set internal, cuma buat yang ngembangin CLI-nya.

9. Perintah Sesi: login, logout, store, switch, whoami, populate

Ini yang paling sering bikin bingung pembaca tutorial lama, karena semuanya hilang di 3.x.

shopify login [--store <store>] autentikasi dan masuk ke toko. --store nerima prefix (example), URL myshopify (example.myshopify.com, https://example.myshopify.com), URL admin (https://example.myshopify.com/admin), atau custom domain (https://example.com, https://example.com/admin). Kamu harus punya akses kolaborator, staff, atau owner (04 Dev Store, Akun Kolaborator, dan Theme Access); buat dev store kamu harus owner atau punya staff account.

shopify logout ngehapus kredensial (dan development theme!), kamu autentikasi ulang di koneksi berikutnya. shopify store nampilin toko yang terhubung (You're currently logged into example.myshopify.com). shopify switch [--store <store>] ganti toko tanpa logout-login, tanpa flag kamu diminta milih. shopify whoami nampilin organisasi Partner atau toko tempat kamu login sebagai staff.

shopify populate [ products | customers | draftorders ] [ --count <n> ] nambah data contoh: produk (judul dan harga), pelanggan (nama saja), draft order (satu item kustom); default lima record; produk yang dibikin gak dipublish ke sales channel mana pun. Di 3.x penggantinya adalah data contoh bawaan dev store (04 Dev Store, Akun Kolaborator, dan Theme Access > 2. Data Contoh Bawaan) dan CSV uji dari 71 Testing Theme buat Theme Store > Aset Uji.

Tabel Padanan ke CLI 3.x

Oktober 2022, dukungan theme masuk ke CLI 3.0 dengan autentikasi dan pengelolaan toko yang lebih sederhana, biar jumlah perintah berkurang dan pengalamannya konsisten antara theme, app, dan custom storefront:

  1. Autentikasi: shopify login → gak perlu; kamu diminta login waktu ngejalanin perintah yang butuh autentikasi.
  2. shopify whoami → gak didukung.
  3. Pilih toko: shopify login --store → flag --store di perintah pertama yang butuh toko; toko itu dipakai perintah berikutnya.
  4. Ganti toko: shopify switch → --store dengan nilai baru.
  5. Lihat toko: shopify store → shopify theme info.
  6. Preview: shopify theme serve → shopify theme dev.
  7. Isi data: shopify populate → gak didukung.
  8. Folder: argumen posisi [root] → flag --path.

Sisanya (init, check, list, open, pull, push, share, publish, package, delete) namanya sama, dan 3.x nambah console, profile, preview, info, rename, duplicate, metafields pull, language-server (05 Shopify CLI > Daftar Perintahnya).

Instalasi 2.x (Kalau Terpaksa)

Syarat: Ruby 2.7+ (Windows: Ruby+Devkit dari RubyInstaller, atau WSL dengan Ubuntu) dan Git. Instal sebagai gem dari home directory di semua platform:

gem install shopify-cli

Linux juga bisa lewat apt (unduh .deb dari halaman releases GitHub, lalu sudo apt install /path/to/download/shopify-cli-x.y.z.deb) atau yum (.rpm, sudo yum install /path/to/download/shopify-cli-x.y.z.rpm). Verifikasi dengan shopify version.

1. Upgrade

Pakai package manager yang sama dengan waktu instal. Homebrew: brew update lalu brew upgrade shopify-cli@2. Hati-hati: brew upgrade shopify-cli (tanpa @2) menginstal CLI terbaru (3.x); kalau mau tetap di 2.x, instal ulang dengan brew install shopify-cli@2, dan formula itu dijalankan dengan nama program shopify2 (shopify2 theme push). apt dan yum: unduh dan instal file baru. RubyGems: gem update shopify-cli.

2. Uninstall

Homebrew: brew uninstall shopify-cli (2.2x ke bawah) atau brew uninstall shopify-cli@2 (2.3 ke atas); apt: sudo apt remove shopify-cli; yum: sudo yum remove shopify-cli; RubyGems: gem uninstall shopify-cli.

3. Migrasi dari Versi Legacy (< 0.9.0)

Sebelum 0.9.0, CLI diinstal sebagai repository Git di ~/.shopify-app-cli, bukan paket. Tandanya: shopify version ngasih command not found. Langkahnya:

  1. Hapus filenya: rm -rf ~/.shopify-app-cli/.
  2. Hapus baris yang ditambahin installer di shell profile (~/.bash_profile, ~/.zshrc, ~/.bash_login, ~/.profile, atau ~/.config/fish/config.fish), yang bentuknya mirip:
if [[ -f /HOME_DIR/.shopify-cli/shopify.sh ]]; then source /HOME_DIR/.shopify-cli/shopify.sh; fi
[ -f "/HOME_DIR/.shopify-app-cli/shopify.sh" ] && source "/HOME_DIR/.shopify-app-cli/shopify.sh"
  1. Buka terminal baru; shopify harus command not found. Kalau malah muncul shopify command is no longer bundled with shopify_api. if you need these tools, install the shopify_cli gem, berarti gem shopify_api lama masih ada: gem list shopify_api, gem install shopify_api (v9.2.0+), lalu gem uninstall shopify_api -v x.y.z buat versi lama (instal/update shopify_api dulu kalau kamu juga punya shopify_app).
  2. Instal versi baru dan autentikasi ulang dengan shopify login.

Migrasi ke CLI 3.x

  • macOS + Homebrew: gak perlu uninstall, langsung brew upgrade shopify-cli. CLI 3.x butuh Node.js 18+ selain syarat 2.x, dan Homebrew menginstalnya buat kamu.
  • Lainnya: instal Node.js 18+; uninstall 2.x dengan package manager asalnya (apt/yum/RubyGems, atau manual buat legacy) biar gak bentrok; instal 3.x sesuai petunjuk resmi, dengan catatan apt, Yum, dan RubyGems gak didukung lagi buat 3.x; verifikasi shopify version.
  • Dua versi sekaligus: keduanya pakai nama program shopify, jadi yang jalan adalah yang lebih dulu di PATH. Ubah PATH buat ganti default, atau uninstall sementara salah satunya. Alternatifnya formula shopify-cli@2 yang programnya bernama shopify2.

Ringkasan

  1. CLI 2.x = alat Ruby (gem shopify-cli) buat theme dan app; deprecated, gak didukung, pakai 3.x kecuali diinstruksikan khusus; bab ini buat baca materi lama.
  2. Konsep development theme sama dengan 3.x (tersembunyi, gak dihitung, hapus setelah 7 hari), tapi 2.x ngehapusnya waktu logout; struktur folder wajib standar (belum ada blocks/); .shopifyignore dan --ignore sama.
  3. Perintah theme: init (Dawn), serve (= dev, 127.0.0.1:9292, --live-reload hot-reload|full-page|off, --theme-editor-sync dua arah dengan merge), check (fail level error|suggestion|style), list, open, pull (--nodelete), push (--unpublished, --publish, --allow-live, --json), share, publish, package, delete.
  4. Perintah sesi yang hilang di 3.x: login --store (prefix/URL/admin/custom domain), logout, store, switch, whoami, populate products|customers|draftorders --count (default 5, produk gak dipublish).
  5. Padanan: login → otomatis; whoami → hilang; login —store/switch → --store; store → theme info; serve → theme dev; populate → hilang (pakai data dev store/CSV); [root] → --path.
  6. Instal 2.x: Ruby 2.7+ dan Git, gem install shopify-cli (atau .deb/.rpm); upgrade dengan manager yang sama (brew upgrade shopify-cli@2, shopify2 buat formula @2); uninstall brew uninstall shopify-cli(@2), apt remove, yum remove, gem uninstall.
  7. Legacy < 0.9.0: hapus ~/.shopify-app-cli, hapus baris source ...shopify.sh di shell profile, bersihkan gem shopify_api lama, instal ulang, shopify login.
  8. Ke 3.x: Homebrew cukup brew upgrade shopify-cli; selain itu Node 18+, uninstall 2.x, instal 3.x (apt/yum/gem gak didukung); dua versi bentrok di PATH.

Bab selanjutnya adalah bab penutup buku: Theme Kit, alat command-line generasi sebelumnya lagi (biner Go dengan config.yml dan theme watch), gimana cara kerjanya, referensi perintah dan konfigurasinya, troubleshooting, dan kenapa semuanya sekarang digantikan Shopify CLI.