セクションギャラリー：OS 3.0 テーマにオープンソースパーツを追加する – SHOPLINE ヘルプセンター

「セクションギャラリー」アプリを使用すると、OS 3.0テーマを利用しているビジネスオーナーは、柔軟でカスタマイズ可能、かつ完全に編集可能なオープンソースのパーツを簡単に追加できます。この機能により、ストアデザインの制御が強化され、PCおよびモバイルのレイアウト編集が効率化されます。

このガイドでは、セクションギャラリーアプリの使用方法、インストール手順、カスタマイズのヒント、パーツコードの編集、制限事項、およびよくある質問について説明します。

重要な注意事項：

セクションギャラリーのパーツは、OS 3.0テーマでのみ利用可能です。
セクションギャラリーのパーツをテーマエディタに追加すると、そのテーマはプライベートテーマになり、公開バージョンからの自動更新を受けなくなります。

アプリを使用するタイミング

レイアウトの柔軟性が必要な場合や、現在のテーマでは利用できない高度なページパーツにアクセスする必要がある場合は、セクションギャラリーの使用を検討してください。

一般的なシナリオ

専門的なページ表示パーツの追加：セクションギャラリーは、画像とテキストのレイアウト、商品ショーケース、テストモニアルセクション、動画モジュール、仕様テーブル、ファイルダウンロードブロック、スクロールバナーなど、幅広いオープンソースのパーツを提供します。これらのパーツは多様なユースケースをサポートし、ページおよびブロックレベルでの柔軟な構成を可能にします。
テキスト、ボタン、背景、または間隔などの要素のカスタマイズ：セクションギャラリーを使用すると、個々のパーツの外観やレイアウトを詳細な設定で微調整できます。コードに触れることなく、ブランドデザインに合わせて画像の角、影、パディング、フォントスタイルなどの視覚要素を簡単に調整できます。

注意：すべてのセクションギャラリーのパーツはOS 3.0テーマと互換性があり、マルチレベル構造をサポートしているため、セクションレベルや個々のブロック内など、さまざまなエリアにパーツを追加できます。

アプリのインストールと使用

以下の手順に従って、セクションギャラリーをインストールし、OS 3.0テーマにパーツを追加します：

SHOPLINEアプリストアからセクションギャラリーをインストールする方法

SHOPLINEの管理画面からアプリに移動し、アプリストアに移動ボタンをクリックします。
「セクションギャラリー」を検索し、インストールをクリックして、アプリのインストールを完了するために認証します。

テーマにセクションギャラリーのパーツを追加する方法

アプリをインストールした後、テーマに追加するパーツを選択します。
ポップアップウィンドウで、パーツをインストールしたいOS 3.0テーマを選択します。
テーマエディタに移動をクリックして、ビジュアルエディタを開きます。

または、オンラインストア > デザインに移動して、テーマエディタにアクセスし、必要に応じてパーツを追加します。テーマの使用と公開に関する詳細は、このヘルプセンターガイドのテーマエディタへのアクセスと使用のセクションを参照してください。

パーツの配置とカスタマイズ方法

「+ パーツを追加」をクリックし、使用したいセクションギャラリーパーツを選択します。追加したら、テーマ内の希望の位置にパーツをドラッグします。セクションギャラリーは、セクショングループ内や個々のブロック内に配置するなど、複数のレベルをサポートしています。
組み込みの設定パネルを使用して、テキスト、ボタン、背景、間隔、レイアウトスタイルをカスタマイズします。
デザインが完了したら、保存をクリックして変更を適用します。その後、プレビュー > オンラインストアを表示をクリックして、ライブストアフロントでのパーツの表示を確認します。

パーツコードの編集

コーディングの経験がある場合は、セクションギャラリーのパーツのコードを直接編集して、レイアウトや動作をさらにカスタマイズできます。

SHOPLINEの管理画面からオンラインストア > デザインに移動し、セクションギャラリーパーツがインストールされたテーマを見つけます。テーマの横にある⋯（三点アイコン）をクリックし、コードを編集を選択します。
コードエディタの左サイドバーでsectionsフォルダを開いて、インストールされたパーツを表示します。
SGC-で始まるファイルを探します（例：SGC-product-list.css）。検索バーを使用してSGCを検索すると、すべてのセクションギャラリーパーツを迅速に見つけることができます。
編集したいファイルをクリックして、パーツのコードの編集を開始します。

重要：セクションギャラリーコンポーネントが追加されると、テーマはプライベートテーマになり、自動的または手動で更新できなくなります。

コンポーネントの再インストールによるコードの更新または復元

セクションギャラリーコンポーネントを元の状態に復元する必要がある場合、バグ修正を適用したり、最新バージョンに更新したり、ローカルコードの編集を元に戻したりすることができます。セクションギャラリーアプリから直接コンポーネントを再インストールできます。

再インストールすると、テーマエディタ内のレイアウト構造、コンテンツ、スタイル設定など、既存の視覚設定に影響を与えることなく、SHOPLINEが提供する元のコンポーネントコードが更新されます。これにより、ストアフロントの外観を保持しながら、安全にコードをリセットできます。

注意：セクションギャラリーコンポーネントにコードレベルの変更を加え、レイアウト設定を失うことなくデフォルトバージョンに戻したい場合は、この機能を使用して元の構造を復元してください。

コンポーネントの再インストール方法

SHOPLINEの管理画面からアプリに移動し、セクションギャラリーアプリを検索して開きます。
再インストールしたいコンポーネントを見つけて再インストールをクリックし、アクションを確認します。

重要：システムは元のファイル名に基づいてインストールされているコンポーネントを判断します。コンポーネントファイルの名前を手動で変更した場合（例：sgc-shopping-image.liquid）、システムはそれを認識せず、新しいコピーをインストールする可能性があります。

制限事項

OS 3.0テーマとのみ互換性があります：セクションギャラリーコンポーネントは、OS 3.0で構築されたテーマにのみ追加できます。非OS 3.0テーマはテーマ選択のドロップダウンに表示されません。

コンポーネントを追加するとテーマはプライベートテーマになります：セクションギャラリーコンポーネントが追加されると、テーマはプライベートバージョンに変換されます。

重要：プライベートテーマは自動的または手動で更新できません。将来的にテーマバージョンを更新するには、SHOPLINEにホワイトリストサポートをリクエストする必要があります。

よくある質問

セクションギャラリーを非OS 3.0テーマで使用できますか？
いいえ。セクションギャラリーはOS 3.0テーマとのみ互換性があります。非OS 3.0テーマはコンポーネントを追加する際にテーマ選択のドロップダウンに表示されません。

コンポーネントを追加すると既存のテーマ設定に影響しますか？
いいえ。新しいセクションギャラリーコンポーネントを追加しても、現在のページレイアウトや他のコンポーネントには影響しません。
コンポーネントの元のコードを復元するために再インストール機能を使用する場合（例えば、バグ修正を適用したりローカル編集を元に戻したりするため）、システムはコンポーネントのコードのみを更新します。テーマエディタで設定されたレイアウト、テキスト、スタイルなどの既存の視覚設定は変更されません。

注意：同じコンポーネントを再インストールまたは再追加し、フォルダ名が既存のバージョンと一致する場合、システムは元のコード構造を上書きする可能性があります。コンポーネントファイルの名前を手動で変更した場合、システムはそれを認識せず、新しいコピーをインストールする可能性があります。

同じテーマ内で複数のセクションギャラリーコンポーネントを使用できますか？
はい。同じOS 3.0テーマ内で複数のコンポーネントをインストールして使用できます。各コンポーネントは独立して機能し、ストアの異なるエリアに配置できます。

この記事はAIを使用して翻訳されており、不正確な部分が含まれている可能性があります。最も正確な情報については、元の英語版を参照してください。