成功
カスタムコード
Custom Liquid、CSS、アプリ、またはコード編集でAlign Shopifyテーマを拡張します。
カスタムコードでAlignを拡張する
Section titled “カスタムコードでAlignを拡張する”Alignには、一般的な変更の多くに対応する組み込みのテーマ設定が用意されています。これらの設定で要件を満たせない場合は、カスタムHTMLまたはLiquid、カスタムCSS、アプリ、またはコードを直接編集してAlignテーマを拡張できます。
まず、Shopifyテーマエディターで、現在のAlignテーマで利用できる設定を確認します。プラットフォームに関するガイダンスについては、テーマエディターに関するShopifyドキュメントを参照してください。
カスタムHTMLまたはLiquidを追加する
Section titled “カスタムHTMLまたはLiquidを追加する”一部のテーマには、テンプレート、セクション、またはブロック内にHTMLまたはLiquidを追加するための設定があります。これらの設定を使用すると、テーマコードを直接編集せずに、サポートされているカスタムコンテンツを追加できます。そのため、テーマのアップデート対象資格を維持しやすくなります。
続行する前にAlignのドキュメントを確認し、テーマにカスタムHTMLまたはLiquidのオプションが含まれているか確認してください。Custom Liquidセクションを使用して、次のことができます。
Liquid設定では、限られた数のLiquidオブジェクトとタグにアクセスできます。サポートされているオプションについては、Liquid設定のドキュメントを参照してください。
カスタムCSSを追加する
Section titled “カスタムCSSを追加する”CSSは、テーマ全体で要素がどのように表示されるかを制御します。利用可能なAlign設定では対応できないスタイル変更が必要な場合は、ShopifyのカスタムCSS機能を使用してください。
カスタムCSSは、テーマ全体、またはテンプレート内の特定のセクションに適用できます。この作業には、CSSとHTMLに関する知識が必要です。変更を加える前に、Company XYZのAlignドキュメントと、Company XYZサポートのサポートリソース、および利用可能なテーマサポートに関するShopifyのガイダンスを確認してください。
アプリをインストールする
Section titled “アプリをインストールする”アプリは、いくつかの方法でAlignテーマと統合できます。
-
必要な場所にアプリの機能を追加し、テーマエディターでカスタマイズまたは削除します。App blocksはOnline Store 2.0テーマでのみ利用できます。ヴィンテージテーマの場合は、アプリのリストとドキュメントで互換性を確認してください。
-
テーマエディターで、アプリが提供するオーバーレイ、フローティング要素、またはバックグラウンド機能を有効化、無効化、カスタマイズできます。
-
一部のアプリは、コードをテーマに直接追加します。アプリによっては、アプリ設定またはテーマエディターで管理できます。テーマにCustom Liquidセクションが含まれている場合は、テーマコードを直接編集する代わりに、そこへアプリコードを追加できることがあります。
別のテーマを公開する場合は、新しいテーマでアプリを再度有効化してください。アプリはデフォルトでは有効になりません。
テーマコードを編集する
Section titled “テーマコードを編集する”テーマエディター、カスタムCSS、Custom Liquid、アプリでは要件を満たせない場合、コードを直接編集することで詳細な変更を行えます。
編集時の考慮事項と安全対策については、コードを使用したテーマ編集に関するShopifyドキュメントを参照してください。
HTMLとCSSを扱うことに慣れており、Liquidの基本を理解している場合にのみ、テーマコードを編集してください。Align固有のガイダンスについては、Company XYZサポートから始めてください。Shopifyサポートは、対象となるShopify所有の無料テーマについて、特定のコードカスタマイズを支援できます。このプラットフォームポリシーについては、Shopifyのテーマサポートガイダンスを参照してください。
テーマコードは、次の2つの方法で編集できます。
- Shopify管理画面で直接コードを編集します。
- Shopify CLIやShopify GitHub連携などの開発ツールを使用して、ローカルで作業します。
使用上の注意
Section titled “使用上の注意”- まずテーマ設定から始めます。 カスタムコードやアプリに移行する前に、組み込みのAlignオプションを使用してください。
- Custom Liquidは慎重に使用します。 コンテンツを追加する前に、必要なLiquidオブジェクトとタグがサポートされていることを確認してください。
- アプリの互換性を確認します。 特にヴィンテージテーマを使用している場合は、アプリのドキュメントを確認してください。
- テーマの変更を計画します。 新しいテーマを公開した後は、アプリを再度有効化してください。
- アップデート対象資格を保護します。 他のカスタマイズ方法では必要な結果を実現できない場合にのみ、コードを直接編集してください。