WooCommerceとは？

WooCommerceは、WordPressでECサイトを作成するためのプラグインです。他にもECサイトが作成できるサービスとしては、ShopifyとかStoresなどがありますが、ブログも一緒に運営していきたいとか、一からECサイトをDIYしたいというのであれば、WooCommerceを使ってみると良いのかなと思います。

WordPressでサイトを作成していくので、いろんなプラグインを組み合わせれば、いろいろ実装することができます。物販はもちろん、noteのようなデジタルコンテンツを販売したり、オンラインコースを販売し、さらには同じサイト内でコースを提供したり、会員サイトだって作成することもできます。

たくさんの可能性があるので、DIYが好きな人にとってはとてもおすすめです。DIYと言っても、商品を販売する仕組みを構築するのは全く難しくありません。この記事を参考にしていただければ、1日で作成できると思います。遅くても、2日くらいでできるはずです。

WooCommerceに適したテーマをインストールする

WooCommerce用に作成されたテーマはたくさんありますが、今回はStorefrontというWooCommerceが公式に配布しているテーマを利用していきたいと思います。

WooCommerceプラグインをインストールする方法

次に、WooCommerceをインストールしていきます。一般的なプラグインと違って、有効化するまでの設定がちょっと時間がかかりますので、丁寧に確認していきたいと思います。

まずは、「プラグイン」の「新規追加」に移動し、検索窓で「WooCommerce」と検索をかけてみてください。すると、左上にWooCommerceのプラグインが表示されるので、「今すぐインストール」して「有効化」します。

すると、このポップが表示されます。これは、WooCommerceにデータを自動的に送信して、そのデータを今後の改善に役立ててもらうかどうかというものです。もし、WooCommerceの改善に貢献したいというのであれば、チェックボックスにチェックを入れ、「次へ」ボタンをクリックします。別に貢献したくないという場合は、チェックを外したまま「次へ」ボタンをクリックしましょう。

次に、このようなページに遷移します。ここから何ステップかでWooCommerceのインストールに必要な基本的な設定をしていきます。

次に、決済の設定をしていきます。ここで、決済手段を導入できるわけではありません。プラグインをインストールするかどうか聞かれているだけです。基本的にStripeは使用していくと思うので、Stripeは有効化して、チェックボックスにチェックを入れ、その下の欄にメールアドレスを入力します。ただ、後ほどStripeの決済を導入する方法を詳しくご紹介していくので、ここは無効にしておいてもOKです。

次に送料の設定です。こちらも後ほど詳しい設定をご紹介していきますので、有効化されている2つの項目を両方とも無効化して、「次へ」のボタンをクリックしてしまってOKです。

次に、「おすすめ」というページに移動してきますが、ここはスキップでOKです。MailChimpというEメール配信サービスと連携したりできますので、必要があればチェックを入れておいてください。使用しない場合は、全ての項目からチェックを外して「次へ」もしくはスキップします。

*Storefrontのテーマは、こちらからもインストールできるようになったみたいです。

次のページでは、Jetpackというプラグインをインストールするかどうか聞かれますが、特に必要がなければ、スキップします。

いよいよ最後の項目です。このページのトップでは、WooCommerceからECサイトの運営や商品・サービスのアップデートなどのメルマガを受け取りたい場合は、空欄にEメールアドレスを入力して、「はい、お願いします！」ボタンをクリックしましょう。特に必要がなければ、「ダッシュボードを表示」というボタンをクリックして、WordPressのダッシュボードに移動します。

WooCommerceで初期設定をする方法

このセクションからは、WooCommerceの初期設定の方法をご紹介していきます。

一般の設定

• 番地：会社もしくは自宅の番地
• 建物名・部屋番号：会社もしくは自宅の建物名と部屋番号（任意）
• 市区町村：会社もしくは自宅の市区町村名
• 都道府県：会社もしくは自宅の都道府県名
• 郵便番号：会社もしくは自宅の郵便番号
• 販売を展開する地域：基本的に「日本」を選択
• 配送可能地域：デフォルトでOK
• お客様の基本地域：デフォルトでOK
• 税金を有効化：決済時に税金額を表示させたい場合はチェック
• クーポンを有効化：クーポンを使用する場合は「クーポンの使用を有効化」にチェック。また、複数のクーポンを有効化したい場合は、「逐次クーポン割引を計算します」にもチェック。
• 通貨：デフォルトの日本円（¥）でOK
• 貨幣記号の表示位置：日本円の場合はデフォルトの「左」でOK
• 3桁ごとの区切り文字：デフォルトでOK
• 小数点の区切り文字：デフォルトでOK
• 小数点以下の桁数：デフォルトでOK

商品の設定

一般

• ショップページ：通常ショップページ（商品一覧ページ）が設定されていますが、別のページに変更することも可能。
• 「かごに入れる」の処理：商品をかごに入れた瞬間にカートのページに飛ばしたい場合は、「正常に追加された後、カートのページにリダイレクトします。」にチェック。カートページに飛ばさずに、かごに商品が追加されるだけにしたい場合は「AJAXはアーカイブの「カートに追加」ボタンを有効にします。」にチェック。
• プレースホルダーの画像：商品画像を設定していない場合に使用する画像のURLを追加する。
• 重量単位：デフォルトでOK
• 寸法単位：デフォルトでOK
• レビューを有効化：各商品にレビューを表示させたい場合は「商品のレビューを有効化する」にチェック。商品を購入した人からのレビューだということ示したい場合は「カスタマーレビューのために「承認」のラベルを表示する」にチェック。この場合、商品を購入していない人もレビューできてしまいます。そもそも、商品を購入してくれた人にしかレビューしてもらいたくないという場合は、「レビューは「確認が取れている所有者」だけが残すことができる」にチェック。
• 商品の評価：レビューをもらう際に5つ星の評価もしてもらいたい場合は「レビューで星の評価を有効にする」にチェック。さらに、その星の記入を必須にしたいのであれば、「オプションの評価ではなく、星の評価が必要です。」にもチェック。

在庫

• 在庫管理：物販などで在庫を表示する必要がある場合は「在庫管理を有効化」にチェック。
• 在庫保持（分単位）：デフォルトの在庫数を記入。商品毎に設定することも可能。
• 在庫通知：在庫が少なくなったことを通知してほしい場合は「在庫低下通知を有効化」にチェック。在庫が切れたことを通知してほしい場合は「在庫切れ通知を有効化」にチェック。
• 通知受信者：在庫の通知を受けるEメールアドレスを入力。
• 在庫低下を知らせる数値：在庫がどれくらいになったら在庫低下の通知を受けるのか数値を記入。
• 在庫切れを知らせる数値：在庫切れなので「0」でOK。
• 在庫切れの表示：チェックを入れておくことで、在庫切れの商品はショップページなどから非表示になる。
• 在庫表示形式：ドロップダウンから在庫に関する好きな表記を選択。

ダウンロード商品

デジタルコンテンツを販売する際に必要になってくる項目にはなりますが、基本的にはデフォルトのままでOKです。

• ファイルダウンロード方法：ファイルの配布方法を選択。
• アクセス制限：ファイルをダウンロードするのをログイン済みの人に限定したい場合は「ダウンロードには、ログインが必要です」にチェックを入れ、リンクを知っている人全員がダウンロードできるようにしたいのであれば「支払後にダウンロード商品へのアクセス権を付与」にチェックを入れる。

税の設定

税オプション

• 税込み価格：商品の価格を税込みにするか税抜きにするかの項目。
• 以下に基づく税の計算：デフォルトでOK。
• 送料税クラス：デフォルトでOK。
• 税の丸め計算：デフォルトでOK。
• 追加の税金クラス：デフォルトでOK。
• ショップで表示する価格：ショップページでの値段の表記を選択。
• 支払いやカートで表示する価格：支払ページやカートでの値段の表記を選択。
• 価格表示の接尾辞：（税込）か（税抜）をつけるという意味だが、デフォルトでOK。
• 税金合計を表示：デフォルトでOK。

標準税率

標準税率では、一般的な税金を設定します。ここで設定した金額がそれぞれの商品の料金に反映されます。設定方法は簡単で、「行を挿入」というボタンをクリックして、「率 %」の項目に税率を記入します。2020年2月現在では、10%なので、「10」と記入しておきます。

免税率

「免税率」は、日本向けにビジネスをする場合は必要ないと思うので飛ばします。

軽減税率

「軽減税率」は、2020年5月現在では機能しないので以下の記事で詳細をご確認ください。

送料の設定

WooCommerceで物販のECサイトを作成する方で、送料を有料にする場合は、ちょっと設定が複雑になりますので、別の記事で詳しくご紹介しているので、チェックしてみてください。

• WooCommerceでの基本的な送料の設定
• クーポンを使って送料を無料にする方法
• 地域毎に異なる送料を請求する方法
• 一定額以上の購入で送料を無料にする方法

をご紹介しています。もしかしたら、商品のサイズや重さによって請求する送料を変更したいという場合があるかもしれませんが、phpコードを追加する必要があったりと、結構難しい設定になりますので、それは省略してしまっています。ご了承ください。

決済の設定

決済の設定では、決済方法の導入や設定ができます。いろんな決済が用意されていますが、ビジネスのタイプやターゲットに合わせて設定してみてください。

WooCommerceにStripeを導入する方法

まずは、Stripeの導入方法からです。Stripeを使うことによって、クレジットカードで決済を受けることができるようになります。そのためには、Stripeのアカウントの取得しないといけません。詳細は以下の記事からチェックしてみてください。

WooCommerceにPayPalを導入する方法

PayPalは、クレジットカードもしくはPayPalの預金を使って支払いを受けることができます。僕も、インターネットで商品やサービスを購入する際は、PayPalが用意されていると、必ずと言って良いほど利用します。お客さんとしては、クレジットカード番号やCVCコードなどを入力しなくても済むので非常に便利なんですね。

じゃあ、Stripeなんて必要ないんじゃないの？と思う方もいらっしゃるかもしれませんが、PayPalはお客さんがPayPalのアカウントを所有していることが条件になりますし、商品をオファーするたびに別のページに遷移して決済をしてもらう必要があります。Stripeでクレジットカードによる決済を受ければ、次回以降は、オートコンプリートと言って、自動でクレジットカード情報を入力してくれるので、簡単に購入してもらえるというメリットがあります。どちらにもメリット・デメリットが存在しますので、できるだけ両方の決済を導入しておくことをお勧めします。

WooCommerceに銀行振込を導入する方法

銀行振込を導入したい場合は、「WooCommerce」の「設定」から「決済」タブに移動し、「銀行振込（日本向け）」の「管理」ボタンをクリックします。

• 銀行名
• 支店名
• 口座種別
• 口座番号
• 口座名義

すると、このような画面が表示されるので、「振込銀行口座詳細:」というセクションで、上記の5つの項目を記入します。複数の銀行を扱うのであれば、「口座を追加」ボタンをクリックして追加可能です。設定が終わったら、「変更を保存」しましょう。

WooCommerceに店頭払いを導入する方法

お店に直接来店してもらって代金を受け取りたい場合は、「店頭払い」の設定をしていきます。銀行振込と同じく、「管理」ボタンをクリックします。

店頭払いの場合は、特別必要な設定というのはありませんが、「説明」の欄、もしくは「説明書き」の欄にお店の住所や営業時間、支払日や連絡の方法などを記載しておくと良いかもしれません。

アカウントとプライバシーの設定

• ゲストの購入処理
• アカウント作成
• アカウントの削除リクエスト
• 個人データの削除
• プライバシーページ
• 登録のプライバシーポリシー
• 購入処理のプライバシーポリシー
• 無効なアカウントを保持する
• 保留中の注文を保持する
• 失敗した注文を保持する
• キャンセルされた注文を保持する
• 完了した注文を保持する
• Stripeデータを保持

この項目の設定は、全部、基本的にデフォルトのままでOKです。ただし、「プライバシーページ」に関しては、あらかじめ用意されているページではなく、ちゃんと設定済みのページを作成、あるいは編集しておきましょう。

メールの設定

• 新規注文
• キャンセルされた注文
• 失敗注文
• 注文保留
• 処理中の注文
• 完了済みの注文
• 払い戻し注文
• お客様へのインボイス/注文の詳細
• 注文メモ
• パスワードをリセット
• 新しいアカウント
• 失敗したサブスクリプション更新 SCA 認証
• 予約注文の支払いアクションが必要です
• 支払い認証要求メール

次に「メール」の設定を確認していきます。上部の設定は、通知メールに関する設定になります。14の項目がありますが、それぞれ送信するかどうかの設定や受信者の設定などは、「管理」ボタンから可能です。

• 有効化/無効化
• 受信者（複数可）
• 件名
• メールヘッダー
• 追加コンテンツ
• メール形式

上記の項目が設定できますが、基本的にデフォルトでOKです。もし、通知メールを受け取りたくないとかお客さんに送り必要がないと思うものがあれば、「有効化/無効化」の項目はチェックを外します。また、複数のEメールアドレス宛にメールを送信したいのであれば、「受信者（複数可）」の項目に、カンマで区切って記入します。例えば、「support@example.com,info@example.com」みたいな感じです。

• 送信元の名前：サイト運営者もしくはサイトの名前を入力。
• “配信元”アドレス：サイト運営者のEメールアドレスを入力。
• ヘッダー画像：先ほど設定したメールに表示するヘッダー画像のURLを入力。
• フッターテキスト：メールのフッターに記載したい文言を設定。（デフォルトでは、サイト名が記載されるように設定されます。）
• ベースカラー：デフォルトでWooCommerceのブランドカラーが設定されているので、自分のサイトのカラーがおすすめ。
• 背景色
• Body背景色
• Bodyテキスト色

連携の設定

• MaxMindライセンスキー
• データベースファイルパス

「連携」のタブでは、MaxMindというサービスを使って、IPアドレスから位置情報を取得できるみたいですが、あまり必要ないと思うので飛ばしたいと思います。

上級者の設定

固定ページ設定

• カートページ
• 購入手続きページ
• マイアカウントページ
• 利用規約
• 支払い
• 注文受付
• 決済方法を追加
• 決済方法を削除
• 基本の決済方法に設定
• ご注文
• 注文を表示
• ダウンロード
• アカウントを編集
• 住所
• 決済方法
• パスワードを忘れた場合
• ログアウト

このタブの項目は、デフォルトでOKです。でも、「固定ページ設定」の各ページは、WooCommerceのプラグインをインストールすると自動で作成されますが、デフォルトのままになっているので、固定ページから編集しておきましょう。

REST API

この項目は僕は使ったことがないので飛ばします。

Webhook

この項目は、Webhookを通じて、外部サービスと連携することができるんですけど、ここも使っていないので飛ばしたいと思います。

レガシー API

ここも使っていないので飛ばします。

WooCommerce.com

• 追跡を有効にする：WooCommerceにサイトの運営状況を提出してプラグインの改善に協力することができますが、チェックを入れても入れなくてもどちらでもOK。
• 提案を表示：チェックを入れておくことで、おすすめのプラグインなどの提示をしてくれます。

WooCommerceで商品を作成する方法

WooCommerceでは、物販商品はもちろん、デジタル商品（eBookや音声、動画など）を販売することもできます。

また、WooCommerceの各商品にはバリエーションをつけることもできます。例えば、デザインが同じで色が異なるTシャツを販売する場合、別々に商品を作成しても良いですが、1つの商品の中で黒と白、青、赤、のように複数の選択肢を設定することができます。

WooCommerceでクーポンを作成する方法

WooCommerceの商品をプロモーションする際は、通常価格で販売するのも良いですが、より購入してもらうために、割引価格でセールスしたいことがあると思います。

割引価格の設定は、それぞれの商品の設定画面からでも設定することはできます。ただし、こういったセール価格は、直接商品ページに表示されますので、例えば5,000円以上の商品を購入してくれたお客さんに、今度買い物してもらうときに使える30%オフのクーポンを発行したいとか、送料無料のクーポンをプレゼントしたいなんてことがあると思います。その場合は、WooCommerceのクーポン機能でクーポンを作成してみてください。

WooCommerceでランディングページを作成する方法

今回ご紹介した StorefrontというWooCommerceの公式テーマは、ページの外観を自由に変更することはできません。なので、オリジナルのページにしたいというのでれば、専用のツールが必要になってきます。

• Elementor Pro
• Divi

僕がオススメするのは、この2つのプラグインです。これらは、有料のプラグインになりますが、ドラッグ&ドロップで自由にページをカスタマイズすることができる、非常に優れたツールです。

ショップページを作成する方法

Elementor Proを使ってWooCommerceのショップページを作成する方法

このショップページは、Elementor Proを使って作成しました。作り方は、別のページで詳しくご紹介しているので、ぜひ参考にしてみてください。

WooCommerceサイトの表示速度について

WooCommerceは、高機能なプラグインだからかもしれませんが、プラグインの容量は大きめです。そこで、様々なプラグインを使って高速化を図っていると思います。

でも、1つ注意が必要です。それは、キャッシュ系のプラグインです。キャッシュ系のプラグインは、キャッシュを生成することで、2回目以降、同じサイトに訪問する場合は、前に訪問した際のデータを渡してくれます。新たに、データを取得する必要がなくなるために、高速化できるわけですが、WooCommerceを使用する際は注意が必要です。
WooCommerceには、決済ページやカートページなど、独自のページが用意されています。それらのページのキャッシュを生成してしまうと、古いデータを渡すことになり、決済ができなかったり、不具合が生じる可能性があるので、注意してください。

おすすめのWooCommerce関連プラグイン

最後に、WooCommerceを使ってECサイトを運営するのに便利なプラグインをご紹介していきます。

WooCommerce Direct Checkoutプラグイン

Direct Checkout for WooCommerceプラグインは、商品をカートに入れるのではなく、直接決済ページに誘導することがで