ゼロから始めるサイト制作7：ECサイトを作ってみましょう 決済サービス篇
はじめに
こんにちは、DevOps推進部2グループの李です。
今回の記事はECショップ構築第2部の決済サービス編です。
前回はWordPressでECショップの構築について紹介しました。
今回は引き続き決済サービスの設定を紹介させていただきます。
連載目次
決済サービスとは
決済サービスは、電子的な支払方法を提供するサービスです。
WordPress用の有名な決済サービスはWooCommerce（ウーコマース）とWelcart（ウェルカート）の2つのプラグインがあります。
Welcartは日本製のECプラグインですが、WooCommerceは圧倒的なシェアで世界的に普及しているプラグインです。WordPressのプラグイン一覧に記載されているダウンロード数によると、WooCommerceは500万回以上のダウンロード数があります。Welcartは2万回以上です。
そのため本記事はWooCommerceを使って紹介させていただきます。
WooCommerceの設定
前回の記事でAstraのE-Commerceテンプレートをインポートした際に、WooCommerceが自動的にインストールされました。
WooCommerceの設定については先ずWordPressの管理画面で、左側メニューの「WooCommerce」の中の「設定」をクリックして、上部の「一般」タブのページでショップの住所と基本設定を入力します。
販売を展開する地域と配送可能地域を「日本」と選択してください。通貨は日本円を選択して保存します。
次は上部の「商品」のタブをクリックしてください。WooCommerceの商品は一般商品とダウンロード商品の2つの種類があります。
ここでは一般商品を設定する方法を紹介します。「ショップページ設定」でショップページの名前を選んでください。前回の記事でインストールしたテンプレートのショップページは「Store」です。
「「お買い物カゴに追加」の処理」などはお好きな設定を選択してください。変更完了したら保存します。
在庫ページでは未払い注文の在庫保持時間と在庫低下の通知が設定できます。ここも好きな設定を選んでください。
「アカウントとプライバシー」ページでは未登録で注文できるかどうかと、プライバシーポリシーの説明が設定できます。
「メール」ページではどんな状況が発生したらメールで通知するかを設定できます。この2つのページの設定はぜひお試しください。
次は「配送」ページの内容を説明します。先ずは「配送地域を追加」ボタンをクリックして、地域名とゾーン地域に日本を選択します。
WooCommerceでは初期設定として定額送料、送料無料、店頭渡しの3つの配送方法を提供しています。「配送方法を追加」ボタンをクリックすると配送方法を追加できます。
配送方法を追加しましたら、該当する配送方法の編集ボタンを押すと詳しい設定ができます。例えば送料無料には最低注文金額が設定できます。
「配送」タブの「配送クラス」では、一般商品や冷凍商品などの配送分類を追加できます。ここで「一般商品」と「冷凍食品」を追加します。
配送クラスを追加したら、配送方法の編集でそれぞれのクラスの個別設定ができます。
最後は一番大事な「決済」タブです。決済ページは幾つかの支払方法を提供しています。
ここではカード決済と銀行振込を紹介します。先ずは「Stripe Card Processing」と「直接銀行振込」を有効にします。有効になりましたら、Stripe Card Processingの「管理」ボタンをクリックして、管理ページを開きます。
カード決済の管理ページを表示されましたら、「Stripe API Setting」をクリックして、「Connect with Stripe」ボタンをクリックします。
Stripe API Settingをクリックしたら、Stripeの設定ページに移動します。設定ページで、Stripeアカウントとして登録してあるメールアドレスを入力して続けるをクリックします。
アカウントを作っていない場合、次のページの「アカウント作成ページ」で新しく作ることができます。
アカウント作成ページで、使用したいメールアドレスとパスワードを入力して、次のページで電話番号を入力してください。両方とも入力しましたら、Stripeから認証メールと認証SMSが送信されます。
認証が完了しましたら、下記の画面が表示されます。ここで「連結する→」ボタンをクリックします。
連結するボタンを押したら、アカウントの基本資料について幾つの質問が出てきます。質問にはご自分の登録情報を選択してください。
全部の情報を入力して「完了」ボタンをクリックすると下記の画面が表示されます。ここでStripe Card Processを有効にして下の「Enable Gateways」ボタンをクリックします。次のページでは「Enable Express Checkout」をクリックします。
Enable Webhooksの画面でテストモード（test）を選択して、完了します。
WordPressの管理画面に戻ると、Stripe APIの設定が完了しました。
次は「直接銀行振込」の設定です。直接銀行振込の「管理」ボタンをクリックすると、銀行振込時の「説明」内容や「手順」の案内などを追加できます。ここで「アカウント詳細」欄に、振込先に指定するご自分の銀行口座を登録してください。
設定が完了しましたら、正常に動作するかを一度試してみましょう。ECサイトで任意の商品をカートに入れて、支払いページに進みます。
支払いページの注文の内容に、先ほど「配送」タブで設定した配送料が表示されて、「決済」タブで設定したカード決済と銀行振込先も表示されていることが確認できましたら、これで決済サービスの設定はすべて完了しました。
次回のお知らせ
今回はWordPressのショップに決済サービスを追加設定しました。
これでWordPressの紹介は終了になります。
最終回となる次回はテーマとプラグインを紹介したいと思います。
最後までお読みいただきありがとうございました。
また次回の記事でお会いしましょう！
参考資料：
執筆者プロフィール：李 嘉興
社会人になって以来、数年間システムエンジニアとして多数のプロジェクトの開発（要件定義～リリース）を経験したのち、2021年7月にSHIFTに入社。システムエンジニアの仕事と全く違う分野の自動化とCICDを経験しつつ、未来のキャリアのため日々奮闘中。
お問合せはお気軽に
https://service.shiftinc.jp/contact/
SHIFTについて（コーポレートサイト）
https://www.shiftinc.jp/
SHIFTのサービスについて（サービスサイト）
https://service.shiftinc.jp/
SHIFTの導入事例
https://service.shiftinc.jp/case/
お役立ち資料はこちら
https://service.shiftinc.jp/resources/
SHIFTの採用情報はこちら
https://recruit.shiftinc.jp/career/