🚀 サイト構築が難しい?手取り足取りご案内します——「WordPressサイト構築伴走」サービスを詳しく見る →

WooCommerceチュートリアル

— 初心者必見のWooCommerce入門チュートリアル

Naibaは何度も、WordPressサイト構築を使用しているユーザーがWooCommerceのデザインで問題に遭遇するのを見てきました。そのため、このWooCommerceチュートリアルを更新し、初心者が遠回りしないように役立てたいと思います。

まず明確にすべきは、WooCommerceを使用してB2Cオンラインストアを構築できるだけでなく、B2Bの一般的な商品見積もりサイトも作成できるということです。
WooCommerce教程指南

初心者によくある誤解の修正

誤解1

B2BサイトではWooCommerceは使えない。なぜなら、それはオンラインストア用だから。

この理解は正確ではありません。WooCommerceは確かにオンラインストア用ですが、実際にはその販売機能を削除すれば、商品の管理と表示だけに使用し、B2Bサイトで利用することもできます。

誤解2

WooCommerceを使うには、必ずElementor Proを使って自分で商品ページのレイアウトをデザインしなければならない。そうしないと自分のニーズに合わない。

実際、多くの初心者にとって、Elementor Proを使ってWooCommerceのレイアウトを自分で作成するのは、デフォルトのレイアウトを調整するよりもはるかに難易度が高いです。通常のB2Bサイトでは、WooCommerceのデフォルトテンプレートを使用すれば実現できます。Elementor Proで商品レイアウトを作成して問題が発生し、Naibaに解決方法を尋ねるケースがよくあります。

WooCommerce完全チュートリアルガイド

インストールからB2Bカスタマイズまでの完全ソリューション

WooCommerceインストールチュートリアル

WooCommerceはWordPressプラットフォームのプラグインなので、インストール方法は他のプラグインと同じで、WordPress管理画面のプラグインから検索してインストールするだけです。

WooCommerce安装教程

インストール完了後、プラグインを有効化します。

Woocommerce教程

初めてWooCommerceをインストールして有効化すると、設定ウィザード画面に遷移します。B2Cのニーズがある場合は、ウィザードに従って設定を完了してください。B2Bユーザーの場合は、そのままスキップして構いません。

WooCommerce製品カテゴリー

WooCommerceのインストールが完了したら、管理画面の製品メニューで製品カテゴリーを作成します。以下の図を参照してください:

製品カテゴリーを作成する際は、Nameを入力し、必要に応じてPanent categoryを選択して追加します。

WooCommerce製品の追加

製品カテゴリーの作成が完了したら、最初の製品をアップロードできます。製品メニューで「新規追加」をクリックします。

次に、製品のタイトル、説明、カテゴリー、画像などの情報を入力して公開します。

具体的な入力箇所については、以下の2つの図の注釈を参照してください。B2B顧客は製品価格を入力しなければ、カートボタンは表示されません。使用しているテーマで依然としてカートボタンが表示される場合は、以下の記事を参照してください:WooCommerceのカート追加ボタンを削除・非表示にする方法

公開後、製品のフロントエンドページにアクセスして効果を確認できます。

WooCommerce B2B製品のカスタマイズ

1、カート追加ボタンを削除するには?

通常、管理画面で製品価格を入力しなければカートボタンは表示されません。テーマが効かない場合は、以下を試してください:WooCommerceのカート追加ボタンを削除・非表示にする方法

2、カートの位置にお問い合わせボタンを追加するには?

参考:WooCommerceの購入ボタンの下にお問い合わせボタンを追加する方法

3、評価 Reviews タブを削除するには?

Woocommerce教程

WooCommerceの設定で、製品を選択し、評価のチェックを外せばなくなります。

4、詳細ページに表を挿入するには?

Excelから直接コピー&ペーストするのが最も簡単です。または、以下の記事を参照してください:WordPressに表を追加する6つの方法

5、詳細ページにいくつかのタブを追加し、パラメータやダウンロードリソースを個別に表示するには?

管理画面のプラグインで検索:Custom Product Tabs for WooCommerceをインストールします。その後、新規製品作成時に、製品データ部分に新しいタブのオプションが表示されます。必要な数のタブを追加してください。

サイトのフロントエンドで商品一覧ページを表示するには?

多くの人は、デフォルトの商品一覧ページをどう表示させるかわからず、Elementor Proで商品テンプレートページを作成する必要があると考えがちですが、実は以下の操作だけで可能です。

WooCommerce商城页面

デフォルトでは、WooCommerceプラグインのインストール完了後、ショップページ(shop)が自動生成・設定されます。

この時、そのページのリンクをナビゲーションメニューに追加するだけで、そのURLにアクセスしてショップページを表示できます。

  1. 管理画面のページから、新規ページを作成し、「Products」など任意の名前を付けて公開します。
  2. WooCommerce設定で「商品」を選択し、先ほど作成したページをショップページとして設定し保存します。

woocommerce商店页

個別のカテゴリーに対して商品一覧ページを作成するには?

個別の商品カテゴリー一覧ページも、新規ページ作成は不要です。管理画面の商品カテゴリーに移動し、カテゴリー名にマウスを合わせると表示される「表示」リンクをコピーするだけです。

×
二维码

QRコードをスキャンしてフォロー

AIサイト構築アシスタント

🤖
こんにちは!私はNaibaサイト構築ノートのAIアシスタントです。何かお手伝いできることはありますか?
クイックコンサルティング: