最も必要とされている時に、信頼できるWordPressチュートリアルを。
WordPress入門ガイド
WPBカップ
2500万人以上
当社のプラグインを使用しているウェブサイト
16+
WordPress経験年数
3000+
専門家によるWordPressチュートリアル

返品を減らし、売上を増やす:WooCommerceにサイズチャートを追加する方法

購入者が商品のサイズが合うかどうか確信が持てないために、どれだけの売上を失っているか考えたことはありますか?

オンラインで衣類や靴を購入する際、顧客にとって最大の懸念は適切なサイズを得ることです。この不確実性により、タブを閉じて、より明確な情報を提供する店舗を探すことになり、カート放棄や売上の損失につながります。

サイズの疑問だけで潜在顧客を失うことがどれほど残念なことか、私は理解しています。そのため、多くの店舗オーナーが商品ページに明確なサイズガイドを設定するのを支援してきました。これにより疑問が解消され、顧客は自信を持って「カートに追加」をクリックできるようになります。

このガイドでは、証明された3つの方法を使用して、WooCommerceストアにサイズチャートを簡単に追加する方法を説明します。最終的には、返品を減らし、売上を伸ばし、顧客を満足させるシステムが整います。

WooCommerce製品ページにサイズチャートを追加する方法

要約: WooCommerceにサイズチャートを追加するには、いくつかの方法があります。予算が限られている場合は、無料のWPC Product Size Chartプラグインを使用できます。既製のサイジングテンプレートをインポートして時間を節約したい場合は、Advanced Product Size Charts Proをお勧めします。SeedProdを使用して、商品ページレイアウトをカスタムデザインすることもできます。

WooCommerceストアにサイズチャートを追加する理由

オンラインストアでの返品率が高い主な原因は、多くの場合、サイズの間違いです。顧客が合わない商品を受け取ると、顧客にとっては不満な体験となり、あなたにとっては追加の送料がかかります。

明確なサイズガイドを追加することで、購入前に必要なすべての情報が購入者にあることを確認できます。これにより信頼が築かれ、人々は自信を持って「カートに追加」ボタンをクリックできるようになります。

返品を減らすだけでなく、プロフェッショナルなサイズチャートは、ストアにいくつかの技術的なメリットをもたらします。

  • コンバージョン率の向上: 購入者は、フィット感の心配がない場合、購入を完了する可能性がはるかに高くなります。
  • サポートチケットの削減: 特定の測定値を尋ねる顧客からのメールに、それほど多くの時間を費やす必要がなくなります。
  • モバイルエクスペリエンスの向上: ポップアップチャートを使用すると、モバイルユーザーは商品ページを離れることなく、すばやくサイズを確認できます。
  • SEOの改善: 測定値などの詳細な商品情報は、ストアがより具体的な検索クエリで表示されるのに役立ちます。
WooCommerce製品ページにサイズチャートを追加するメリット

サイズチャートを追加するために数分を費やすことは、購入者との信頼を築き、収益を保護するための最も簡単な方法の1つです。

それを念頭に置いて、コーディングなしでサイトにこれを設定するための最良の方法を見てみましょう。

どの方法があなたに適していますか?

予算やデザインのコントロールの度合いに応じて、ストアにサイジングガイドを追加するにはいくつかの異なる方法があります。以下のクイックリンクを使用して、ニーズに最も合った方法にジャンプできます。

これらのいずれの方法を開始する前に、アクティブなWooCommerceストアがあり、少なくともいくつかの製品が既に追加されていることを確認してください。

まだ設定していない場合は、WooCommerceをシンプルにに関する私のステップバイステップガイドに従ってください。

方法1:無料プラグインを使用してサイズチャートを追加する

サイジングテーブルを追加するための信頼性の高い無料の方法を探している場合は、WPC Product Size Chart for WooCommerceプラグインをお勧めします。非常に軽量で、初心者にも非常に使いやすいです。

まず、プラグインをインストールしてアクティブ化する必要があります。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するガイドを参照してください。

アクティブ化したら、WordPress管理ダッシュボードのSize Charts » Add Newに移動して、最初のガイドを作成します。

まず、サイズチャートにわかりやすいタイトル(例:「レディースシューズサイズ」)を付けます。

WPC製品サイズチャート for WooCommerce でチャートタイトルを追加する

次に、「Configuration」ボックスまでスクロールダウンします。

製造元からJPEGまたはPNG画像としてサイジングガイドが提供されている場合は、「Above Text」または「Under Text」エリア内の「Add Media」ボタンをクリックして、画像をチャートに直接アップロードできます。

WPC製品サイズチャート for WooCommerce で画像サイズチャートを追加する

ただし、プラグインのグリッドを使用してテキストベースのテーブルを構築する方が、通常はモバイルショッパーにとって良いことを覚えておいてください。これにより、ピンチズームなしで小さな画面に自動的にリサイズされます。

測定値を入力したい場合は、中央にある「Chart Table」セクションを探してください。

ここでは、行と列を追加してレイアウトを構築し、フィールド内をクリックしてサイジングデータを入力できます。

WPC製品サイズチャート for WooCommerce でサイジングチャートテーブルを作成する

最後に、このチャートをどこに表示するかをプラグインに指示する必要があります。Configurationボックスの上部にある「Apply」ドロップダウンを探してください。

時間を大幅に節約するために、ここではチャートを特定の製品カテゴリに割り当てることを強くお勧めします。これにより、自動的に表示されます。

WPC製品サイズチャート for WooCommerce で製品カテゴリにサイズチャートを自動的に適用する

このドロップダウンから「None」を選択した場合、個々のWooCommerce製品をすべて手動で編集し、Product Dataボックス内にある新しい「Size Charts」タブを使用してチャートを割り当てる必要があります。

完了したら、画面上部にある「Publish」ボタンをクリックします。

WPC製品サイズチャート for WooCommerce サイズチャートを公開する

プラグインは、指定された製品に「Size Chart」ボタンを自動的に追加します。顧客がこのボタンをクリックすると、測定ガイドがクリーンで情報量の多いポップアップで開きます。

方法2:プレミアムプラグインを使用してサイズチャートを追加する

手動でテーブルを作成するのは数個の商品には適していますが、大規模なストアではより迅速なワークフローが必要になることがよくあります。

既製のテンプレートや、すっきりとしたポップアップ表示などの高度な機能については、プレミアムプラグインのAdvanced Product Size Charts Proの使用をお勧めします。

まず、Proプラグインを購入、インストール、有効化する必要があります。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するガイドを参照してください。

Proバージョンが有効になったら、WordPress管理ダッシュボードのサイズチャート » すべてのサイズチャートに移動します。

Advanced Product Size Charts Pro の既製サイズチャートテンプレートライブラリ

「Men's T-Shirt」や「Women's Shoes」のような、約10個の既製のチャートが表示されます。これらはすぐに使用できるテンプレートです。

最初から始めるのではなく、製品タイプに最も近いテンプレートを見つけてください。

タイトルにカーソルを合わせ、「編集」リンクをクリックします。これにより、すべての測定データが事前に入力された状態でチャートエディターが開きます。

「チャートテーブル」セクションまでスクロールすると、測定グリッドが表示されます。

Advanced Product Size Charts Pro でチャートテーブルを作成する
  • 編集するには:セルのいずれかをダブルクリックして、在庫に合わせて数値またはテキストを変更します。
  • 拡張するには:行または列の末尾にある(+)ボタンを使用して、新しいサイズ(XXLなど)または新しい測定タイプ(「袖丈」など)を追加します。
  • クリーンアップするには:未使用の行の「ゴミ箱」アイコンをクリックして、ライブサイトに不格好な空白スペースとして表示されないようにします。

専門家のアドバイス:チャートをカスタマイズする際は、ゴミ箱アイコンを使用して空の行をすべて削除してください。エディターに空白行を残しておくと、ライブ製品ページに不格好な空白スペースが生じ、購入者を混乱させる可能性があります。

次に、ページ上部近くの「サイズチャート設定」セクションまでスクロールします。

サイズチャートの位置については、「モーダルポップアップ」を選択します。これは最も人気のあるプロフェッショナルな選択肢です。

Advanced Product Size Charts Pro でポップアップオプションを選択する

次に、「サイズチャートリンクタイトル」フィールドを使用して、実際のボタンテキスト(「フィットガイドを表示」など)を変更できます。

また、「ポップアップアイコン」ドロップダウンを使用して、リンクの横に視覚的な手がかりを追加したり、「チャートテーブルのフォントサイズ」を調整して、すべてのデバイスでテキストが読みやすいことを確認したりすることもできます。

Advanced Product Size Charts Pro でその他のポップアップ設定をカスタマイズする

最後に、どの製品にこの特定のチャートを表示するかをWooCommerceに伝える必要があります。

画面の右側にある、カテゴリの割り当て、タグの割り当て、属性の割り当て、製品の割り当て専用のメタボックスを確認します。

Advanced Product Size Charts Pro で製品にサイズチャートを割り当てる

時間を節約するために、「カテゴリの割り当て」メタボックス(「シャツ」や「靴」など)で関連するボックスをチェックするだけです。これにより、そのカテゴリのすべてのアイテムにチャートが自動的に適用されます。

在庫の他のアイテムとは異なるフィット感のユニークなアイテムがある場合は、「製品の割り当て」ボックスを使用して、その特定のアイテムにのみチャートを適用できます。

すべてが設定されたら、画面の右側にある「更新」または「公開」ボタンをクリックします。これでサイズチャートがライブになります。

Advanced Product Size Charts Pro でサイズチャートを更新する

ボタンが正しい位置に表示され、ポップアップがデスクトップとモバイルの両方で正しく表示されることを確認するために、製品ページのいずれかを新しいタブで開くことを強くお勧めします。

方法3:ページビルダーを使用してサイズチャートを追加する

サイズガイドが表示される場所と製品ページ全体の表示方法を完全に制御したい場合は、SeedProdウェブサイトビルダーの使用を強くお勧めします。

SeedProdを使用すると、現在のWordPressテーマが置き換えられます。そのため、オンラインストア全体をゼロから再設計したい場合に最適な方法です。

これにより、サイズチャートを価格のすぐ下やカスタム製品タブ内など、コンバージョンが最も高くなる場所に正確に配置できます。

SeedProdを使用すると、真にユニークなショッピング体験を構築する自由が得られます。

カスタムストアデザインの設定に関する詳細なウォークスルーが必要な場合は、WooCommerce製品ページをカスタマイズする方法(コード不要の方法)のガイドをご覧ください。

注意:この方法に必要な特定のWooCommerceブロックとウェブサイトビルダー機能にアクセスするには、SeedProd Eliteライセンスが必要です。

まず、SeedProdプラグインをインストールしてアクティブ化する必要があります。

ヘルプが必要な場合は、WordPressプラグインのインストール方法のガイドを参照してください。Eliteライセンスをご購入いただいたので、SeedProd »設定ページでライセンスキーをアクティブ化することを忘れないでください。

SeedProd Proのライセンスキーの検証

次に、WordPress管理ダッシュボードのSeedProd »ウェブサイトビルダーに移動します。

注意:このチュートリアルでは、「AIテーマビルダー」メニューは無視してください。ここでは手動コントロールを使用します。

サイズチャートのレイアウトを作成するには、「クイックアクション」セクションの「新しいテンプレートを追加」ボタンをクリックします。

SeedProd ウェブサイトビルダーで新しいテンプレートを追加する

表示されるポップアップで、テンプレートにわかりやすい名前(例:「シングル製品カスタム」)を付けます。

次に、「タイプ」ドロップダウンから「シングル製品」を選択します。

SeedProd で新しい単一製品テーマテンプレートを作成する

次に、「条件」を設定する必要があります。

デフォルトでは、SeedProdはこれを「含める」および「製品投稿タイプ」に自動的に設定します。これは、新しいレイアウトがストアのすべての製品に表示されることを意味します。

それが目的の場合は、「保存」ボタンをクリックするだけです。

SeedProd ですべての製品にサイズチャートを追加する

ただし、この特定のサイズチャートを特定のアイテムにのみ表示したい場合は、簡単に変更できます。

ドロップダウンメニューをクリックし、「WooCommerce」セクションまでスクロールダウンして、「製品カテゴリ」を選択する必要があります。

カテゴリの正確な名前またはスラッグ(例:「シャツ」または「靴」)をテキストボックスに慎重に入力し、「テンプレートを作成」をクリックする必要があります。

SeedProd で製品カテゴリにサイズチャートを追加する

SeedProdは、ビジュアルドラッグアンドドロップエディターを開きます。画面の左側には、WooCommerceブロックのセクションが表示されます。

製品画像、製品タイトル、製品価格、カートに追加ボタンなどの必須ブロックをキャンバスに直接ドラッグアンドドロップして、レイアウトを構築できます。

SeedProd で製品ページを構築する

サイジングガイドを追加するには、次の3つのプロフェッショナルなオプションから選択できます。

  • 画像ブロック:価格のすぐ下に「画像」ブロックをドラッグし、サイズガイドのグラフィックをアップロードします。
  • 商品データタブブロック:このブロックをレイアウトにドラッグします。設定で新しいタブを追加し、「サイズガイド」という名前に変更して、測定テーブルをコンテンツエリアに入力または貼り付けます。
  • アコーディオンブロック:「アコーディオン」ブロックをドラッグし、「サイズを確認」とラベル付けします。これにより、ページがすっきりし、顧客が展開をクリックしたときにのみ測定値が表示されます。
SeedProd で製品ページにサイズチャート画像を追加する

カスタム商品ページのデザインに満足したら、エディタの右上隅にある「保存」ボタンをクリックします。

次に、保存ボタンの横にあるドロップダウン矢印をクリックし、「公開」を選択します。

SeedProdでカスタム製品ページを公開する

最後に、SeedProd » ウェブサイトビルダーダッシュボードに戻ります。

準備ができたら、ページ上部にある「SeedProdテーマを有効化」スイッチを「オン」に切り替える必要があります。この手順をスキップすると、カスタムデザインがライブストアに表示されなくなります。

重要:この設定は、アクティブなWordPressテーマをSeedProdに置き換えるため、ウェブサイトビルダーで「ヘッダー」と「フッター」のテンプレートも作成したことを確認してください。そうしないと、ライブサイトでナビゲーションメニューが失われる可能性があります!

詳細については、SeedProdでカスタムWordPressテーマを作成する方法に関するガイドを参照してください。

SeedProdテーマの有効化

カスタム商品ページとサイズガイドがライブになり、買い物客が利用できるようになりました。

WooCommerceストアを最適化するための追加の方法

サイズチャートの追加は素晴らしい第一歩ですが、ストアをより成功させるための他の方法もあります。

適切なツールを使用すると、より多くの訪問者を顧客に変えることができます:

WooCommerceサイズチャートに関するFAQ

多くのストアオーナーが測定ガイドの設定を支援してきました。ここでは、WooCommerceにサイズチャートを追加することについてよく受ける質問をいくつか紹介します。

1. WooCommerceで無料でサイズチャートを追加するにはどうすればよいですか?

無料のWPC Product Size Chartプラグインを使用すると、サイズチャートを無料で追加できます。簡単なテーブルビルダーが含まれており、「メディアを追加」ボタンを使用して、サイズ画像を商品ページに無料で簡単にアップロードできます。

2. 商品カテゴリごとに異なるWooCommerceサイズチャートを表示できますか?

はい、無料のWPC Product Size ChartプラグインとAdvanced Product Size Charts Proプラグインの両方を使用して、特定のカテゴリに異なるチャートを割り当てることができます。これにより、「Tシャツ」カテゴリに1つのガイドを持ち、まったく異なる「靴」カテゴリに別のガイドを持つことができます。

3. サイズチャートプラグインは私のWooCommerceサイトを遅くしますか?

いいえ、適切にコーディングされたサイズチャートツールは非常に軽量です。ユーザーが商品を表示したり、ポップアップボタンをクリックしたりしたときにのみ必要なスクリプトをロードするため、WooCommerceページの読み込み速度に影響を与えることはありません。

4. WooCommerceには組み込みのサイズチャート機能がありますか?

WooCommerceには組み込みのサイズチャート機能はありません。WooCommerceの商品属性を使用して測定値をリストすることはできますが、上記で言及したような専用ツールを使用すると、顧客が読みやすい視覚的なテーブルを作成するのに非常に役立ちます。

5. WooCommerceでサイズチャート画像をアップロードするにはどうすればよいですか?

製造元から提供された、すでに画像(JPEGやPNGなど)として保存されているサイズチャートがある場合は、最初から新しいテーブルを作成する必要はありません。SeedProdを使用して画像ブロックを商品ページレイアウトに直接追加するか、無料のWPC Product Size Chartの設定設定内の「メディアを追加」ボタンを使用できます。

静的な画像は、携帯電話では読みにくい場合があることに注意してください。画像をアップロードする場合は、検索エンジンや視覚障害のある買い物客がサイズ情報を理解できるように、必ず代替テキストを追加してください。

6. サイズチャートに含めるべきデータは何ですか?

衣料品の場合、一般的な測定値にはバスト、ウエスト、ヒップ、股下が含まれます。靴の場合、足の長さが重要です。対象が国際的な場合は、必ずインペリアル(インチ)とメートル法(cm)の両方の単位を含めてください。顧客が正確な測定値を得られるように、「測定方法」ガイドまたは図を追加することを検討してください。

7. サイズチャートはストアの返品を減らすのにどのように役立ちますか?

サイズチャートは商品の測定値を明確に伝え、顧客が最初に正しいサイズを選択するのに役立ちます。これにより、フィットしない商品を受け取る可能性が大幅に減り、返品率が低下し、送料と処理にかかる費用を節約できます。

8. 商品に(S、M、Lなどの)選択可能なサイズを追加するにはどうすればよいですか?

顧客に何をしてもらいたいかによって、WooCommerceストアに機能的なサイズを追加するには2つの異なる方法があります。

  • 購入するサイズを選択する場合: 顧客がカートに追加をクリックする前に商品ページで「中」を選択できるドロップダウンメニューを追加したい場合は、組み込みのWooCommerce商品属性とバリエーションを使用する必要があります。
  • サイズでストアを閲覧する場合: Amazonのようなサイドバーで、顧客が「中」ボックスをチェックして、カタログ全体の中程度のサイズのアイテムのみを表示できるようにしたい場合は、WPFiltersのような商品フィルタープラグインを使用する必要があります。

機能的なサイズを設定するには、商品属性の追加方法商品フィルターの設定方法に関する完全なガイドを確認してください。

オンラインストア向けの追加リソース

これらの方法が、お客様にとってシームレスなショッピング体験の創出に役立つことを願っています。

オンラインビジネスを成長させるための次のステップに進む準備ができているなら、以下で他の記事をいくつか参照することをお勧めします。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterFacebookでも私たちを見つけることができます。

開示: 当社のコンテンツは読者によってサポートされています。これは、一部のリンクをクリックすると、手数料が発生する可能性があることを意味します。WPBeginnerがどのように資金調達されているか、なぜそれが重要なのか、そしてどのように私たちをサポートできるかを確認してください。こちらが当社の編集プロセスです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

コメント

  1. おめでとうございます。この記事の最初のコメント者になる機会を得ました。
    質問や提案はありますか?コメントを残して、議論を開始してください。

返信する

コメントいただきありがとうございます。すべてのコメントは、コメントポリシーに従ってモデレーションされ、メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で意味のある会話をしましょう。