本節では、次に示すテーマファイルの区分ごとに、特徴や実装上の留意点を解説してゆきます。 レイアウトファイル テンプレートファイル セクションファイル スニペットファイル アセットファイル（画像、CSS、JavaScriptなどの静的ファイル） コ […]

本節では、Liquidの文法について解説します。 本書をここまで順に読まれた方は既に把握しているかと思いますが、Liquidの構文は主にShopifyのコンテンツデータを取得し、ページ上に表示するために用います。 　 本節で紹介する内容は次のとお […]

本節では、各ページ・ファイルごとに、留意しておくと実装が進めやすくなるポイントをざっくりと紹介します。 テーマ全体：スタイリング（CSS・Sass） CSSは、拡張子 .css または .css.liquid が利用できます。CSSの中でLiqu […]

オリジナルテーマの構築には、既存テーマのカスタマイズよりも広範なShopifyのスキルが求められます。予算と時間も必要ですし、ディレクターやデザイナーとの協力も欠かせません。 それでも、挑戦する価値はあります。本章ではオリジナルのテーマを実装する […]

Dawnは、日本語フォントの利用にはやや不便なところがあります。 テーマエディタからストア全体のフォント設定を変更しようとすると、英文フォントは豊富な選択肢があるのですが、日本語フォントはゴシック体・明朝体・等幅フォントのシステムフォント3種いず […]

注文時にユーザーからの追加情報を受け付けたいというリクエストは多くのストアで見られます。たとえばギフトラッピングの希望や、商品に刻印する文言、配送の日時指定などです。 アプリを用いて対応しても良いのですが、ちょっとしたカスタム情報の入力欄ならば、 […]

OS2.0に伴い、標準で提供が開始された機能として「メタフィールド」があります。これまではアプリなどの外部ツールを用いる必要があったメタフィールドですが、Shopify標準の機能となったことで、ぐっと使いやすくなりました。 　 メタフィールドを利 […]

マーチャントから多く寄せられるテーマカスタマイズ要望のひとつに、FAQがあります。 いわゆる「よくある質問」とその回答を予めストア上に公開しておけば、購入を迷うユーザーには判断の助けとなりますし、マーチャントも問い合わせ対応の工数を削減でき、双方 […]

本章では、Shopify CLIを用いて、Dawnテーマを実際にカスタマイズしてゆきます。 　 Dawnの特徴だけでなく、他のテーマでも広く役立つ「動的セクション・ブロック」や「メタフィールド」、「フォームの拡張」についても解説しているので、近し […]

開発環境が整ったところで、実際にShopify CLIを立ち上げ、Dawnに簡単な編集を加えてみましょう。 開発テーマの作業内容をストアのテーマライブラリーに反映させる方法も本節で解説します。 事前確認 次の手順が完了していることを確認してくださ […]

開発ツールの導入 開発ストアの準備が整ったら、続けて、開発ツールをインストールしましょう。 開発ストアの準備がまだの方は、こちらの記事をご覧ください。 Shopify テーマ開発を始める準備　〜開発ストアの作成〜 本節では主にShopify CL […]

開発ストアの作成 Shopifyパートナーの登録は済んでいますか？ まだの方は、前回記事をご覧ください。 Shopify テーマ開発を始める準備　〜Shopifyパートナー登録から開発ストアの準備まで〜 準備ができたら、まずは開発ストアを作成する […]

開発環境構築 本章では、テーマ開発を始めるための環境構築について解説します。 アカウントを作ったり、開発用のストアを立ち上げたり、コマンドを叩いて開発ツールを導入したり……なかなか手間が掛かりますが、大変なのは最初の一回だけ。ハンズオン形式で、1 […]

こんにちは。エンジニアの川島です。 先日、ブログ上で『Hello Shopify Themes』第1章を全文無料公開しましたが、その裏で同時進行していたプロジェクトがもうひとつありました。 本書の6ページ目に記載していた、こちらの案内の件です:) […]

こんにちは。エンジニアの川島です。5月なのに肌寒い日が続いており、そろそろ五月晴れが恋しいです…。 執筆を担当したShopifyテーマ開発入門書『Hello Shopify Themes Shopifyテーマ開発ガイド』が販売開始となり、ご感想な […]