サブページの作成方法 Shopify：完全なステップバイステップガイド

簡単な答えは次のとおりです。 Shopify 従来の親子ページ階層はそのままではサポートされていませんが、 Shopifyさん ナビゲーションメニュー, カスタムページまたは ページビルダーアプリ.

これらの方法は、URLがフラットなままでも、コンテンツを視覚的かつ構造的に整理するのに役立ちます。より詳細な制御が必要な場合は、テーマコードをカスタマイズすることもできます。

大規模な eコマースサイトを開設したばかりの方でも、始めたばかりの方でも、ストアを適切に構成することで、顧客のサイト内移動が容易になり、SEO効果も高まります。このガイドでは、サブページの作成に必要な情報をすべて解説します。 Shopify.

サブページが重要な理由 Shopify ストア

サブページ (子ページまたはネストされたページとも呼ばれます) は、サイトのナビゲーションまたは構造において親ページの下にあるページです。

たとえば、「コレクション」というメインページがあり、その下に「メンズ衣料」、「レディース衣料」、「セール品」などのサブページがある場合があります。

にもかかわらず、 Shopify 次のようなサブページのURLはサポートされません /collections/mens、論理階層を作成することもできます。 Shopifyのナビゲーション設定、カスタムページ、アプリ、そして少しの創造性。

サブページの利点:

改善されたユーザーエクスペリエンス： 顧客が探しているものを見つけやすくなります。
より良いサイト構造: 特に大規模な製品カタログがある場合に、コンテンツを論理的に整理するのに役立ちます。
より強力な SEO シグナル: 適切に整理された内部リンク構造は、クロール可能性とランキングの可能性を高めます。
現場滞在時間の増加: 簡単にナビゲートできると、ユーザーはより長くサイトに滞在し、より多くのページを閲覧します。

サブページの構築方法は次のとおりです Shopify 一歩一歩。

オプション1：使用 Shopify 構造サブページへのナビゲーション

サブページの外観を作成する最も簡単な方法は、 Shopify's メニューとナビゲーション 機能です。この方法ではURLは変更されませんが、ユーザーにとってストアが視覚的に整理されます。

ナビゲーションを使用してサブページを作成する方法:

あなたに行く Shopify パネル
ソフトウェアの制限をクリック オンラインストア > ナビゲーション
転送プランを選択し、 メインメニュー
詳しくはこちら 「メニュー項目を追加」 親アイテムを作成する（例：「ショップ」）
他のメニュー項目（例：「メンズ」、「レディース」、「セール」）をサブ項目として追加します
　 ドラッグアンドドロップ 親アイテムの下にネストする

このメニュー構造は、サイトのヘッダーまたはテーマで表示される場所に表示されます。

メニュー構造の視覚的な例:

メニュー項目	サブページ
ショップ	男性用
	婦人向け
	セール

URLは次のように表示されます /collections/mens、これにより、 視覚的階層 サブページを模倣します。

長所：

迅速かつ簡単に
コーディング不要
ほとんどで動作します Shopify テーマ

短所：

URL はフラットなままです（ネストされません）
URL構造によるSEO効果は限定的

この方法は、小規模から中規模のストア、またはアプリやコードを使用しないシンプルさを求めるストアに最適です。

オプション2: カスタムURLを使用して手動でサブページを作成する

ページをより細かく管理し、SEO対策を強化したい場合は、個別のページまたはコレクションを作成し、「ハブ」または親ページの下に論理的にリンクすることができます。これにより、SEO要素とページコンテンツをより適切に管理できます。

ステップ：

に行く オンラインストア > ページ
ページを作成する（例：「すべての商品」または「コレクション」）
各カテゴリーごとにページやコレクションを作成します（例：「メンズファッション」、「レディースファッション」）
内部リンクを使用して親ページを子ページにリンクします
オプションとして、パンくずリストと適切に構造化された内部リンク戦略を使用して、ユーザーと検索エンジンを誘導します。

サンプル URL 構造:

/collections
/collections/mens-clothing
/collections/womens-clothing

これらのページは技術的にはフラットですが、 Shopifyのバックエンドでは、ユーザーが店内を案内する.

表: 親子ページマッピング

親ページ	サブページ/コレクション
/コレクション	/コレクション/メンズ服
	/コレクション/レディース服
	/コレクション/セール

長所：

より優れた SEO 制御 (タイトルタグ、URL、メタデータ)
各ページに豊富なコンテンツを表示できます
ランディングページやSEOサイロの作成に最適

短所：

手動での設定が必要
一貫した内部リンク戦略が必要

オプション3: ページビルダーアプリを使用する

もしあなた完全なデザインの柔軟性を必要としている、またはカスタムランディングページを構築している、使用して ページビルダーアプリ が最善の策です。これらのアプリを使えば、視覚的なレイアウトツールを使ってサブページ構造を模倣した、美しくデザインされたページを作成できます。

広告ⓘ

Top Shopify ページビルダーアプリ:

アプリ	価格（～）	他社とのちがい
PageFly	無料 – $24/月	ドラッグアンドドロップエディタ、 responsive デザイン
将軍	$ 39 /月	A / Bテスト、高度なページ要素
GemPages	$ 29 /月	テンプレート、 SEOツール、モバイル対応

これらのツールを使用すると、コードに触れることなく、ユーザーをあるセクションから別のセクションに誘導するレイアウトを持つカスタムページを作成できます。

ページビルダーを使用してサブページを作成する方法:

ページビルダーアプリをインストールする
メインの親ページを作成します（例：「カテゴリ別に買い物」）
アプリのテンプレートを使用してサブページを作成します（例：「アクセサリー」、「靴」、「新着商品」）
ボタン、画像、または内部リンクを使用して親ページ内のサブページをリンクします。
シームレスなユーザーアクセスを実現するために、これらのページをナビゲーションに追加します。

長所：

完全にカスタマイズ可能なデザイン
モバイルフレンドリーなレイアウト
開発者の助けを借りずに素早くビジュアルを変更

短所：

アプリや機能によっては高額になる場合があります
サイトにサードパーティのコードを追加します（速度に影響する可能性があります）

オプション4: カスタマイズ Shopify テーマファイル

開発リソースやより高度なニーズを持つ店舗の場合は、 テーマファイル 完全な制御が可能です。カスタムテンプレートやパンくずナビゲーションを作成したり、タグやコレクションに基づいてページの表示方法を構成することもできます。

テーマのカスタマイズでできること:

パンくずリストを追加して階層を作成する
関連するサブページまたはコレクションを動的に表示する
親ページと子ページに異なるテンプレートを作成する
Liquidでカスタムセクションを追加する（Shopifyのテンプレート言語)

基本的な手順:

に行く オンラインストア > テーマ > アクション > コード編集
まずテーマをバックアップとして複製します
編集 theme.liquid, page.liquid、またはカスタムテンプレートを作成する
条件文を使用して親子関係に基づいてコンテンツを表示する
ナビゲーションとリンク構造をそれに合わせて更新します

この方法は完全な制御を提供しますが、特にライブストアでは慎重に扱う必要があります。

長所：

完全な柔軟性
任意の構造をミラーリングできます
適切に実行すればSEOにも良い

短所：

コーディングの知識が必要（HTML、CSS、Liquid）
ミスはサイトを壊す可能性がある
実装に時間がかかる

サブページとSEOのベストプラクティス

サブページが実際のサブディレクトリ内に存在しない場合でも、ユーザーと検索エンジンの両方にメリットがあるようにサブページを構造化することができます。

SEO のベストプラクティス:

内部リンクを使用する: 常に親から子へ、またその逆方向にリンクします。
パンくずナビゲーションを追加する: ユーザーのナビゲーションを支援し、検索エンジンに階層信号を送信します。
URL をシンプルかつキーワード中心に保つ: 　 /collections/mens-running-shoes 一般的なものではなく。
構造化データマークアップを含める: 特に製品ページやコレクションページに適しています。
各ページを個別に最適化: 各サブページに固有のメタタイトル、説明、H1 タグを記述します。
重複コンテンツを避ける: 類似のテンプレートを使用している場合は、コンテンツが一意であることを確認してください。

パンくずの例:

ホーム > コレクション > メンズウェア > ランニングシューズ

パンくずは多くの人に支持されている Shopify テーマを追加したり、コードやアプリを使用して手動で追加したりすることもできます。

サブページ構造に役立つツールとアプリ

すべてを手動で行う必要はありません。 Shopifyのアプリエコシステムは、プロセスの一部を高速化および自動化するための豊富なツールを提供します。

便利なアプリ:

アプリ	それは何をする
リンクシャス	行動に基づいたスマートな内部リンク
qikifyのスマートメニュー	高度なメニュー構造、メガメニュー
Shopify SEOマネージャー	メタタイトル、タグなどの管理に役立ちます
パンくず	SEOに適したパンくずリストを追加します
簡単なタブ	ページ内のコンテンツをきれいに整理できます

避けるべき一般的な間違い

サブページは効果的に機能しますが、正しく運用されなければ意味がありません。これらのミスはSEOやユーザーエクスペリエンスに悪影響を及ぼす可能性があります。

主な落とし穴:

関連ページ間に内部リンクがない
サブページ間で重複したコンテンツ
わかりにくいナビゲーションメニュー
どこにもリンクされていない壊れたページや孤立したページ
内容が薄い、または全くないページ

すべてのページに目的があり、他のページからリンクされており、独自のコンテンツがあることを確認します。

最終的な考え

サブページの作成 Shopify WordPress や他の CMS プラットフォームほど簡単ではありませんが、間違いなく実行可能です。

基本メニュー、カスタムページ、サードパーティのアプリ、カスタムコードなど、どんなものでも整理するためのツールが豊富にあります。保管方法これはユーザーにとって意味があり、検索での可視性を高めます。

初心者の方は、まずはナビゲーションから始めましょう。ストアが成長していくにつれて、ページビルダーやカスタムコーディングを活用して、より高度な制御を行うことを検討してください。どのような方法を選ぶにしても、顧客とSEOを念頭に置き、すべてが簡単に見つけられ、リンクが張られ、閲覧できることを確認してください。