このステップバイステップガイドでは、 Shopifyコレクションページを作成してカスタマイズする GemPages で、Shopify コレクションに割り当てて商品を美しく表示し、売上を伸ばしましょう。
Shopify コレクション ページとは何ですか?
A Shopifyコレクションページ 特定のコレクションに属する商品グループを表示する専用ウェブページです。コレクションは、例えば以下のようなカテゴリーやテーマでストアを整理するのに役立ちます。 「サマードレス」「ベストセラー」 or "新着。"
よく構造化された コレクションページを使用すると、顧客がストア内をより簡単にナビゲートし、関連商品をより早く見つけ、サイトに長く滞在できるようになります。これにより、売上が大幅に増加します。
以下に、作成できるコレクションの例をいくつか示します。
- 季節のコレクション（例： 春の必需品)
- 製品タイプのコレクション（例： Tシャツ, Accessories)
- プロモーションコレクション（例： セール商品, Limited Edition )
Shopifyで新しいコレクションを作成する方法は？
作成する前に Shopifyコレクションページ GemPages では、Shopify 管理画面にコレクションがすでに存在していることを確認してください。
GemPages では、Shopify で作成されたコレクションのみを表示できます。
次の 2 種類のコレクションを作成できます。 マニュアル or 自動化（スマート）作成されると、各コレクションは、含まれる製品のギャラリーを示す専用の Web ページとして表示されます。
訪問者はコレクション ページ上の任意の製品画像をクリックして、その製品の詳細を表示できます。
ステップ1： Shopifyにログインします。 Shopify 管理ダッシュボードに移動します。
ステップ2： MFAデバイスに移動する 製品 > コレクション 左側のメニューから 「コレクションを作成」 ボタンをクリックします。
ステップ3： 構成 コレクションタイプ 設定：
- 手動収集: 手動コレクションには、個別に選択した製品のみが含まれます。このタイプのコレクションでは、すべての製品を自由に管理でき、手動で追加または削除するまで製品はコレクションに残ります。
- 自動収集: 自動コレクションでは、特定の条件に基づいて、一致する商品を自動的に含めます。最大60個の条件を設定し、商品が満たす必要があるかどうかを定義できます。 を or どれか ルールに一致する新しい商品を追加すると、自動的にコレクションに追加されます。
ステップ4： その他の必要な情報を入力してください。クリック 「保存」 コレクションを作成します。
GemPages で新しいコレクション ページを作成する方法
Shopifyでコレクションが完成したら、 カスタムコレクションページ GemPages で。
ステップ 1: 新しいページを作成する
GemPages で新しいページを作成するには、次の 2 つの方法があります。
オプション1: ダッシュボードから
- Video Cloud Studioで GemPagesダッシュボード をクリックし ページ.
- または、に行く ページ をクリックし 新しいページを作成する.
オプション2: 編集者から
- ページをカスタマイズしているときに、 ページ名 エディターの上部にあります。
- ページのリストが表示されます。選択してください 新しいページを作成する.
ステップ2： コレクションページの作成方法を選択してください
ステップ1でどの方法を使用したかに関わらず、 XNUMXつのオプション コレクションページを作成するには。
オプション1: 最初から始める
選択する ゼロから始めます コレクションページをデザインしたい場合は、 真っ白なキャンバス.
このオプションでは、レイアウトを思い通りにデザインできる完全な柔軟性が得られます。
オプション2：既製のテンプレートを使用する
プロがデザインしたテンプレートのライブラリから選択することで、作業効率を向上させることができます。
テンプレートを使用するには：
- 利用可能なテンプレートを参照する
- 適切なページタイプをすばやく見つけるには、フィルターを使用してください。 Use Case のセクションから無料でダウンロードできます。
- 使用したいテンプレートにカーソルを合わせます。クリック コレクションページとして使用する。
オプション3：GemPagesファイルをインポートする
以前にエクスポートしたGemPagesファイルをインポートすることで、コレクションページを作成することもできます。
このオプションは次のような場合に役立ちます。
- 保存済みのレイアウトを再利用する
- 店舗間でデザインを共有する
- ページの移行
この方法の詳細については、こちらの記事を参照してください。 https://help.gempages.net/articles/export-import-templates
ステップ3: エディターでコレクションページをカスタマイズする
エディター内では、自由にデザインすることができます Shopifyコレクションページ.
推奨される要素は次のとおりです。
画像レイアウト機能を使用してコレクションページを作成する方法
その 画像をレイアウトに変換 簡潔な あなたがすることができます 画像またはURLを編集可能なページレイアウトに変換する.
これは、セクションを自動的に検出し、視覚的な入力に基づいて構造化されたレイアウトを生成することで、ページ作成を迅速化するのに役立ちます。
以下を使用できます。
- スクリーンショット
- ウェブページのURL
システムは入力内容を分析し、エディタ内に編集可能なセクションを生成します。
ステップ1：新規ページをゼロから作成する
詳しくはこちら ゼロから始めます 空白ページを作成するには、エディターを開きます。エディターを開くと、URLまたは画像をページレイアウトに変換するオプションが表示されます。
ステップ2：入力方法を選択する
この時点で、あなたは XNUMXつのオプション:
- レイアウトを作成するためのURLを貼り付けてください
入力ボックスにウェブページのURLを貼り付けてください。システムがURLを分析し、レイアウト要素を抽出します。
- 画像をアップロードする
アップロードエリアをクリックし、デバイスから画像を選択してください。この画像はページ構造の生成に使用されます。
ステップ3: レイアウトを生成する
- URLを入力するか画像をアップロードした後：
- 詳しくはこちら 生成する.
重要： ページに使用する画像については、必ず法的権利を有していることを確認してください。GemPagesは、お客様と画像所有者との間の著作権紛争について一切責任を負いません。
コレクションをテンプレートに割り当てるにはどうすればいいですか?
新しい コレクションページ正しく表示されるように、1 つまたは複数の Shopify コレクションを割り当てる必要があります。
ステップ1： エディターの右上隅で、 コレクション割り当て.
ステップ2： テンプレートを適用するかどうかを選択します すべてのコレクション またはただ 特定のもの.
その点に注意してください：
- 選択したコレクションに適用: このコレクション ページ テンプレートは、選択したコレクションに適用されます。
- すべてのコレクションに適用: このテンプレートは、すでに他のテンプレートに割り当てられているコレクションを除くすべてのコレクションに適用されます。
ステップ3： 詳しくはこちら 確認します 変更を保存する。
割り当てられたコレクションを含む Shopify コレクション ページが公開されました。
Shopifyメニューにコレクションを追加する方法
コレクションを作成したら、ストアのナビゲーション メニューにコレクションへのリンクを追加して、顧客が簡単に見つけられるようにします。
既存のメニューからコレクションをリンクするには:
ステップ1： Shopify管理画面から オンラインストア > コンテンツ > メニュー.
ステップ2： 「メニュー」ページで、編集するメニューの名前をクリックします。
メニュー項目 セクションをクリックします。 メニュー項目を追加.
ステップ3： 名前 フィールドにコレクションの名前を入力します（これは顧客に表示されます）。
ステップ4： リンク フィールド、選択 コレクションをクリックし、リンクするコレクションを選択します。
ステップ5： 詳しくはこちら 追加をタップし、その後、 保存メニュー.
ページからコレクションへのリンクを作成する方法
コレクションページへのリンクを追加する方法はいくつかあります。最も一般的な方法は、顧客に次のような要素をクリックさせることです。 ボタン、テキスト、または画像 それらを特定のコレクションページに誘導する。
ページにコレクションリンクを追加するには、以下の手順に従ってください。
ステップ1：コレクションにリンクしたいページを開きます
ノーザンダイバー社の GemPagesダッシュボードコレクションページへのリンクを追加したいページを開きます。
詳しくはこちら 編集 エディターに入ります。
ステップ2：リンクしたい要素を選択します
顧客がクリックしてコレクションページへ移動する要素を選択してください。
共通の要素は次のとおりです。
- ボタン
- テキスト
- 画像
例えば、 ボタン要素 それは言う 探してみる or コレクションを見る.
ステップ3：リンクオプションを有効にしてコレクションリンクを追加する
要素を選択した後：
- Video Cloud Studioで 要素の設定 パネル。
- をオンにする リンク セクション => 選択 ページを開く。
- リンクフィールド選択または貼り付け コレクションリンク 顧客を誘導したい場所。
追加後、選択した要素をクリックすると、訪問者は選択したコレクションページにリダイレクトされます。
ShopifyコレクションページのSEO対策
- 説明的なコレクションタイトルとメタディスクリプションを使用します。
- 次のようなキーワードを含める Shopifyコレクションページ, Shopifyコレクションテンプレート, Shopify製品コレクション.
- 魅力的なバナーとテキストを追加して、ページ上のエンゲージメントを向上させます。
- 最適なパフォーマンスを得るために、モバイル デバイスでレイアウトをテストします。
トラブルシューティング: コレクションページに商品が表示されない
1. 製品はコレクションに含まれていません
- 『Brooklyn Galaxy』のために、倪氏はブルックリン美術館のコレクションからXNUMX点の名品を選び、そのイメージを極めて詳細に描き込みました。これらの作品は、彼の作品とともに中国ギャラリーに展示されています。彼はXNUMX年にこの作品の制作を開始しましたが、最初の硬貨には、当館が所蔵する 手動収集商品が手動で追加されていることを確認してください。
- 『Brooklyn Galaxy』のために、倪氏はブルックリン美術館のコレクションからXNUMX点の名品を選び、そのイメージを極めて詳細に描き込みました。これらの作品は、彼の作品とともに中国ギャラリーに展示されています。彼はXNUMX年にこの作品の制作を開始しましたが、最初の硬貨には、当館が所蔵する 自動収集製品が収集条件を満たしていることを確認します。
2. 商品がオンラインストアでアクティブではない、または入手できない
- 商品のステータスは 有効
- その オンラインストア 販売チャネルが有効になっています
3. コレクションテンプレートの割り当ては制限されています
- GemPagesエディタで、 コレクション割り当て 適用されたコレクションを確認します。
4. 変更は公開または同期されていません
- 変更を保存します
- GemPagesでコレクションページを再公開する
- ストアフロントを更新するか、ブラウザのキャッシュをクリアしてください
上記の手順をすべて試しても問題が解決しない場合は、弊社チームまでご連絡ください。 サポート@gempages.help弊社のチームが喜んでお手伝いさせていただきます。
コレクションページに関するよくある質問
1. コレクション ページ テンプレートを別のコレクションに再利用するにはどうすればよいですか?
ページをコピーする必要はありません。GemPagesエディタでコレクションページを開き、 コレクション割り当て、同じテンプレートを別の Shopify コレクションに割り当てます。
2. コレクションページに表示される商品の数を増やすにはどうすればよいですか?
編集 製品リスト要素 表示する商品数を設定します。1ページあたり1～50個の商品を表示できます。保存してコレクションページを再公開してください。
