
Shopifyでカスタマイズをしようと思っている。liquidやcssを編集してストアフロントのデザインを変えたい。
ただ、カスタマイズの参考になるサイトが少なくて困っている。公式のレファレンスやliquidのチートシートがあれば教えて欲しい。
こんなことを考えている方へ。
この記事のポイントは以下です。
私がshopify案件のカスタマイズ時によく見るページ・参考にしているサイト
この記事を書いている私は大阪在住のweb制作フリーランスです。
東証一部のEC企業で5年勤務した後、フリーランスに転向しました。現在はウェブサイトを作ったり、ECサイトを作ったり、サイト分析をしたり、ブログを書いたりして生活しています。
最近はShopifyの案件も増えてきました。
本記事では私がShopify案件で仕事をする際に、よく見るページ・参考にしているページを紹介します。
Shopifyをカスタマイズする際に参考にするサイト
Shopify案件を行う際に参考にしているサイトは以下です。
Shopifyは日本語のヘルプやガイドが圧倒的に少ないです。状況は少しずつ改善していましが、英語の情報が圧倒的です。
恥ずかしながら私は英語が読めないので、Chromeのサイト内翻訳を活用して、ドキュメントを読んでいます。
Shopify Developers
Shopify Developers は開発者向け(カスタマイズする人向け)の公式ドキュメントです。アプリの作成やテーマの自作といった、かなりコアな内容にも触れられています。
Liquid template language reference
「Liquid template language reference」は、先に紹介した「Shopify Developers」の中にあるコンテンツです。
ここではShopifyで使用できるliquidの関数が紹介されています。案件中に一番参照するコンテンツかもしれません。
具体的な使用シーンとしては、

商品のあの情報を出力したいけど、関数あるかなー
とか

顧客情報から一部の情報だけ出力したいけど、関数あるかなー
といった感じで、やりたいことベースでそれに合致する関数を探しにいくパターンが多いです。
Shopify Cheat Sheet — A resource for building Shopify Themes with Liquid
「Shopify Cheat Sheet」は名前の通り、liquidのチートシートです。
liquidのtagやobjectが一覧化されています。タグやオブジェクトの正しい記述方法を調べたりするときに使います。
Liquid template language
「Shopify Cheat Sheet」と同様に、こちらもliquidのチートシートです。
最近だと、タイムスタンプ(date)の出力をカスタマイズする際に使用しました。
Shopify ヘルプセンター
「Shopify ヘルプセンター」は公式の日本語ヘルプです。
コードのカスタマイズの話はほとんど掲載されていません。かわりに、管理画面の操作方法や決済方法、税金の設定方法などの運用面のヘルプが充実しています。
無料テーマDebutでブレッドクラム(パンくずリスト)を表示させる方法や、検索結果をカスタマイズする方法もここで発見しました。
当ブログで紹介している以下の記事も、公式のヘルプの内容を詳しく解説し直したものです。
ただ、なぜか英語版ヘルプには掲載があるのに日本語のヘルプには掲載がない項目があります。ですので、以下の英語版もヘルプも参照することが多いです。
Shopify コミュニティ
「Shopify コミュニティ」では質問を投稿・回答できます。
日本語の回答者が少ないため、Google翻訳をかけて英語で投稿することが多いです(もしくは日英併記)。
とはいえ、そこまで使っておらず過去に2件質問しただけです。こういったコミュニティは質問と回答が活発になればなるほど、有益性が増します。
私ももっと活用しないと駄目ですね。
テーマを作った会社のヘルプ
Shopifyでサイトを構築する際、その多くは有料テーマを導入していると思います。
有料テーマの中には、独自のテンプレートや独自のレイアウトを設定できる機能があります。その設定方法を調べるために、開発元の会社のヘルプページを見ることが多いです。
たとえば最近、Atlantic(アトランティック)という有料テーマを使用しました。
Atlantic(アトランティック)には、コレクションページ(カテゴリページ)やFAQページにオリジナルレイアウトを設定できる機能があったので、公式のヘルプを参照して設定しました。
Shopifyでのサイト構築を学ぶのにオススメな参考書

2020年12月16日に発売された「商品売るならShopify 世界標準かつ最先端のECサイト構築入門」はおすすめです。
shopifyは日本語のレファレンスが少なく、独学しようとすると大変です。ただ、少しずつですが日本語の関連書籍も増えてきました。
ネットで調べたり、shopifyサポートに直接質問したりして学ぶこともできますが、知識にムラが出たり、そもそも正しい情報でなかったり、というリスクもあります。
なので、手元に一冊、shopifyのガイドを置いておくと安心です。その点で「商品売るならShopify 世界標準かつ最先端のECサイト構築入門」はおすすめ。
私も買いましたが「shopifyとは?」という導入から、実際のストア構築方法に至るまで網羅的に情報が掲載されています。
shopifyが他のECカートと違う点や国内の成功事例、運用上のあるあるトラブル、技術的なサポート情報まで掲載されています。

これからshopifyに関わってみたい!

shopify一通り分かっているけれど、抜けてる部分がないか確認したい!
という方におすすめです。
Shopifyで14日間の無料体験をはじめる

・登録にあたってはクレジットカードは不要
・必要なのはメールアドレスだけ
・14日間を過ぎたらサイトは凍結。自動で請求は発生しない
・無料体験中に構築したサイトは本契約後もそのまま使用可能
・無料体験期間中に正式契約しても、無料体験期間が終了するまで月額料金が請求されることはない
まとめ
この記事のポイントをまとめます。
Shopify案件を行う際に参考にしているサイトは以下です。
ドキュメントは基本的に英語です。Chromeの自動翻訳を使って読んでいます。
今回の記事はここまでです。