コメントする前回はWooCommerce(ウーコマース)の商品リストを表示するショートコードについて解説しました。今回はサイドバーに商品リストなどを簡単に表示できるWooCommerce独自のウィジェットについて解説します。サイドバーは重要なナビゲーションなので、しっかりと押さえておきましょう。記事の最後でネットショップとしてのサイドバーの考え方にも触れていますので、是非参考にしてください。ネットショップにおけるサイドバーの考え方ウィジェットとは?すごく簡単に言うと”サイドバーに様々な表示ができるモジュールのようなもの”です。ウィジェットにはいくつかの項目が用意されていて、クリックで選択したり、テキストを入力するだけで、記事リストを表示させたり、カテゴリー一覧を表示させることができます。WordPressのウィジェットをあまり知らない人はこちらの記事が参考になると思います。ウィジェットの設定(AdminWeb)WooCommerce独自のウィジェットWooCommerceには独自のウィジェットが用意されています。WooCommerceの場合は記事リスト→商品リスト、投稿カテゴリー一覧→商品カテゴリー一覧になると考えていただけると分かりやすいと思います。何かを表示するだけでなく、一覧表示されている商品を絞り込む機能を持っているものもあります。ウィジェットの紹介と表示例WooCommerceに標準で用意されているウィジェットについて説明します。WooCommerceカート[入力項目]WooCommerce標準ウィジェット:WooCommerceカート[表示例]カートの表示例サイドバーにユーザーのカートが表示されます。×(バツ)をクリックするとカートから商品を削除することができます。オプションでカートが空の場合は非表示にできます。絞り込みフィルターのナビゲーションです。ユーザーは現在適用されているものを確認でき、またそれを削除することもできます。商品カテゴリを表示時、カスタム属性で商品を絞り込むことができます。リストまたはドロップダウンでの表示ができます。WooCommerce価格フィルター[入力項目]WooCommerce標準ウィジェット:WooCommerce価格フィルター[表示例]価格フィルターの表示例ウィジェット内の価格フィルタースライダー(下限と上限)で、商品のカテゴリに表示する商品リストを絞り込むことができます。商品カテゴリーのリストまたはドロップダウン表示します。WooCommerce商品タグクラウド[入力項目]WooCommerce標準ウィジェット:WooCommerce商品タグクラウド[表示例]商品タグの表示例よく使われるタグクラウド形式で商品タグ一覧を表示します。表示する商品数は任意に変更できます。表示対象は「すべての商品」、「おすすめの商品」、「セール中の商品」から選択できます。並び順の条件(ソートキー)は、「日付(商品登録日)」、「金額」、「ランダム」、「販売数」から選択できます。商品の検索フォームを表示します。新着レビューリストを表示します。表示数は任意に設定できます。WooCommerce最近閲覧された商品[入力項目]WooCommerce標準ウィジェット:WooCommerce最近閲覧された商品[表示例]最近閲覧された商品の表示例ショップ訪問者が最近閲覧した商品をリスト表示します。(ショップ訪問者の閲覧履歴によって訪問者毎に変化します。)WooCommerce評価の高い商品リスト[入力項目]WooCommerce標準ウィジェット:WooCommerce評価の高い商品[表示例]評価の高い商品リストレビュー評価の平均が高い商品リストを表示します。表示数は任意に設定できます。ネットショップにおけるサイドバーの考え方サイドバーはショップに訪れたお客様が商品を探したり、購入の意思決定をする上でとても重要な役割を担っています。WooCommerce独自のウィジェットは商品の表示に関するものがものがほとんどですが、商品以外にも表示すべき要素はあります。例として以下のような要素があります。送料について納期について(商品のお届けの目安)営業日について(出荷業務、問い合わせ対応などが可能な日)ショップの新着情報(新商品、セールなどの情報)ショップブログの記事リストバナー類etcこれらはショップとしてお客様に見えるところにあるべき情報の一例です。すべてサイドバーに置くべきということではなく、ヘッダーやフッターも含めて、情報の配置をしっかり考える必要があるということです。そのショップのコンセプト、ターゲットとなる客層に合わせて情報の配置を考えましょう。その中でサイドバーには何を表示するかを決めましょう。WooCommerceのウィジェットはあくまでも、その要素の一部であるということを踏まえて使用してください。WooCommerceのウィジェットの説明は以上です。次は「ショップのトップページの作り方」です。『【WooCommerce設定ガイド】ショップ構築の7つのステップ』に戻る最後までお読み頂きありがとうございました。この記事が参考になりましたら、シェアしていただけると嬉しいです。KUBO2014年からWooCommerceで構築したショップを運営しています。ショップ構築にあたり、日本語の情報が殆ど無くて苦労しましたが、実際に使ってみると柔軟性が高く、とても便利だと感じました。日本でもっとWooCommerceが普及して欲しいと思い、日本語解説サイトを作りました。これからショップを構築される方のお役に立てれば幸いです。現在は企業・個人のWooCommerceショップの構築・運営・集客の支援もしています。ご相談・ご質問はお気軽にどうぞ。スポット支援も可能です。お問い合わせフォームへWooCommerceオンライン無料相談WooCommerceショップの構築・集客・運営に関するご相談を随時受け付けています。スカイプ、Zoom等のオンライン通話サービスを利用して行いますので、全国どこからでもご相談可能です。前回までの記事で、WooCommerce(ウーコマース)のショートコードとウィジェットの使い方を解説しました。今回は、それらを使ってHTML・CSSが分からない方でも簡単にショップのトップページをデザインする方法を解説します。WooCommerce(ウーコマース)では、画像付きの商品リストを表示させるショートコードが標準で用意されています。今回はそのショートコードについて、よく使いそうなものを中心に紹介・解説します。WooCommerce(ウーコマース)に対応したWordPressテーマは無料・有料ともにたくさんあります。この記事では無料・有料それぞれのテーマについて探し方やインストール方法を簡単に説明します。Japanのインストール・初期設定について解説します。初期設定については、後からすべての項目が変更可能ですのでスキップしても問題ありません。この記事ではWooCommerce(ウーコマース)設定の「一般」タブの設定について解説します。この記事ではWooCommerce(ウーコマース)設定の「Eメール」タブの設定について解説します。Japan」をインストールしている前提での説明になります。WooCommerce(ウーコマース)では商品登録の前準備として「商品カテゴリー」、「商品タグ」、「属性」の登録が必要です。「商品カテゴリー」はネットショップとして最低限必要なものですので必ず登録しましょう。Zones(配送地域)」の導入により、地域別の配送方法の設定が可能になりました。1タグEmail(2)WooCommerce設定(9)WordPressテーマ(1)アカウント(1)ウィジェット(2)キャンペーン販売(1)クーポン(3)ショートコード(3)ショップデザイン例(1)ショップに関する表記(1)代金引換(1)値引き・割引(1)商品カテゴリー(1)商品タグ(2)商品登録(3)商品表示(2)属性(1)支払い・決済(3)消費税(1)税(1)送料(2)配送(2)配送クラス(1)銀行振込(1)コメント・質問はお気軽にどうぞ。返信をキャンセルするメールアドレスが公開されることはありません。付いている欄は必須項目ですMessage名前*メール*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。