Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressでStripe QRコード決済を追加する方法

私たちは複数のオンラインビジネスを運営しているため、支払い方法が売上を左右することを肌で感じてきました。WordPressサイトでの決済を開始した当初は、特に対面取引の場合、オプションは限られていました。

しかし、Stripe QRコードのようなソリューションを利用すれば、対面での支払いをこれまで以上にスムーズに行うことができます。

オンライン決済と対面決済の両方に対応する必要があるビジネスを運営されている場合、StripeのQRコードを使えば、すべてのプロセスがとてもシンプルになります。

このガイドでは、WordPressサイトにStripe QRコード決済を追加する方法をご紹介します。技術に詳しくない方でも、誰でもできる簡単なステップにまとめました。

何百ものビジネスオーナーの決済システム構築を支援してきた私たちは、何がうまくいき、何がうまくいかないかを知っています。

How to add Stripe payment QR code payment in WordPress

なぜWordPressにStripe QRコード決済を追加するのか?

Stripeは、WordPressサイトやeコマースストアでのオンライン決済を可能にする人気の決済ゲートウェイです。これにより、カスタマイザーはクレジットカードを使って簡単に支払いを行うことができます。

一番の利点は、カスタマイザーが面倒な登録手続きをする必要がないことだ。サイト上でクレジットカードを入力するだけで購入できるのだ。

Stripe QRコード決済をサイトに追加すると、カスタマイザーは柔軟に素早く購入を完了できます。カスタマイザーはコードをスキャンするだけで決済リンクを開くことができます。

これにより、購入手続きは非常にシンプルかつ迅速になります。あなたのオンラインストアで商品やサービスを簡単に購入することができます。その結果、コンバージョンが向上し、お買い物カゴの放棄が減少します。

それでは、WordPressサイトにStripe QRコード決済を追加する方法を見てみましょう。

WordPressでStripe決済フォームを作成する

まず、サイト上にStripeの支払いフォームを追加し、カスタマイザーからのオンライン支払いを受け付ける必要があります。

それにはWPFormsを使うのが一番です。WPFormsはWordPress用の最高のお問い合わせフォームプラグインで、とても使いやすく、Stripeとも簡単に統合できます。多くのフォームテンプレートがあり、ドラッグアンドドロップビルダーを使ってカスタマイズすることができます。

WPBeginnerでは、お問い合わせフォームや年間アンケートを作成するために使用しており、超初心者フレンドリーであることがわかりました。さらに詳しく知りたい方は、WPFormsのレビューをご覧ください。

まずはWPFormsプラグインをダウンロードしてインストールしてください。ヘルプが必要な場合は、WordPressプラグインのインストール方法のガイドを参照してください。

注:このチュートリアルでは、Stripeアドオンが含まれているため、WPForms Proライセンスが必要です。無料で使えるWPForms Lite版もあります。WPFormsにはStripeアドオンが含まれているため、WPForms Proライセンスが必要です。

有効化した後、WordPressダッシュボードからWPForms ” 設定に移動し、ライセンスキーを入力することができます。キーはWPFormsサイトのアカウントエリアにあります。

Adding a license key to the WPForms form builder plugin

キーを入力し、「Verify Key」ボタンをクリックするだけです。

それが完了したら、WPForms ” Addonsのページに行き、Stripeアドオンをインストールする必要があります。

Installing the Stripe addon

先に進み、’Install Addon’ボタンをクリックすると、WPFormsが自動的にインストールして有効化します。

ここから、WordPressの管理画面からWPForms ” Settingsに向かい、’Payments’タブに行くことができます。

次に’Connect with Stripe’ボタンをクリックし、画面の指示に従ってアカウントとWPFormsを接続します。

Click the connect with Stripe button

Stripeを接続したら、WPForms ” Add Newで新規フォームを作成します。

WPFormsにはたくさんのフォームテンプレートが用意されています。シンプルなお問い合わせフォーム、注文フォーム、Stripe支払いフォームを選択し、カスタマイズすることができます。

Stripe payment form

このチュートリアルでは、’Stripe Payment Form’テンプレートを使用します。

次に、ドラッグアンドドロップフォームビルダーを使ってフォームをカスタマイズします。初期設定では、テンプレートにさまざまなフォームフィールドが表示されます。

しかし、WPFormsでは、ドロップダウン、チェックボックス、メール、電話、住所、サイトなど、より多くのフォームフィールドをテンプレートに追加することができます。

Customize Stripe payment form

テンプレート上のフォームフィールドをクリックして、さらにカスタマイズすることもできます。

例えば、デモフォームの各項目のテキストを変更し、項目ラベルの後に価格を表示するオプションを有効化しました。

Customize form field in stripe payment form

フォームの編集が終わったら、’Payments’タブに切り替え、左のメニューから’Stripe’を選択するだけです。

ここから、’Enable Stripe payments’オプションが有効化されていることを確認します。

Enable Stripe payments

次に、「設定」タブに切り替えます。ここでは、通知と確認の設定を変更するオプションが表示されます。

例えば、ユーザーがフォームを送信したらどのようなアクションを実行するかを選択できます。WPFormsではメッセージやページを表示したり、ユーザーをURLにリダイレクトすることもできます。

Confirmation settings form

これでサイトにStripe決済フォームを表示する準備が整いました。

保存」ボタンをクリックして変更を保存し、上部の「埋め込み」ボタンをクリックするだけです。

Save and embed your form

次にWPFormsはポップアップを表示し、既存のページを選択するか、フォームを埋め込むための新しいページを作成します。

このチュートリアルでは「既存のページを選択する」オプションを選択します。

Embed a form in page

次に、新しいページの名前を入力する必要があります。

それが完了したら、「Let’s Go」ボタンをクリックするだけだ。

Enter name for your new page

その後、WordPressコンテンツエディターにStripe支払いフォームのプレビューが表示されます。

さっそくページを公開し、サイトを訪れてその動きを見てみよう。

Stripe payment form preview

QRコードを作成するために必要なので、支払いフォームページへのリンクをコピーしてください。

別の方法 WP Simple Payを使ってStripeの支払いフォームを作成することもできます。WP Simple PayはWordPressに最適なStripe決済プラグインで、お買い物カゴを設置せずにオンライン決済を行うことができます。

WP Simple PayはWPFormsよりもわかりやすい設定です。クレジットカードでの支払いを受け付ける基本的なフォームを作成したい場合に最適です。

しかし、より多くのカスタマイザー設定やフォームテンプレートをお探しの場合は、WPFormsを使用することをお勧めします。

詳細については、WordPressでStripeを使用して支払いを受け付ける方法の詳細ガイドを参照してください。

WordPressでStripe決済用のQRコードを追加する

Stripe決済フォームの準備ができましたら、QRコードを作成してサイト上の任意の場所に表示することができます。

サイトにQRコードを追加する方法は2つあります。Google Chromeブラウザーの機能を使うか、WordPressのQRコードプラグインを使うかです。

1.Google Chromeを使ってQRコードを作成する

グーグル・クロームのブラウザーなら、QRコードを使ってウェブページを共有できる。

まず、Stripeの支払いフォームページを新しいタブまたはウィンドウで開きます。

次に、サイトのアドレスバーの右上にある共有アイコンをクリックします。ここから、「QRコードを作成」オプションを選択するだけです。

Click the share icon in chrome

その後、Google ChromeがStripe支払いフォームページ用のQRコードを生成します。

QRコードを画像としてダウンロードすることができます。

Download the QR code

次に、サイト上の任意の場所に画像を配置するだけです。

例えば、商品ページにQRコードを表示することで、カスタマイザーがQRコードを素早く読み取り、フォームを開いて購入することができます。

Add QR code to product page

2.WordPressプラグインを使ってStripe決済QRコードを作成する

Shortcodes UltimateのようなWordPressプラグインを使えば、サイトにQRコードを追加することができます。これは無料のプラグインで、QRコードを含む50種類以上のショートコードを作成することができます。さらに詳しくは、Shortcodes Ultimateのレビューをご覧ください。

まず、Shortcodes Ultimateプラグインをインストールして有効化する必要があります。WordPressプラグインのインストール方法については、こちらをご覧ください。

有効化すると、ショートコードアルティメイトのウェルカム画面が表示されます。

Shortcode ultimate welcome screen

次に、QRコードを追加するためにページや投稿を編集する必要があります。

コンテンツエディターに入ったら、ショートコードブロックを追加するだけです。

How to add a shortcode block to WordPress

その後、「ショートコードを挿入」オプションが表示されるはずです。

二重カギカッコのアイコンをクリックするだけで、QRコードを追加できます。

Click the select shortcode icon

次に、プラグインはあなたのサイトにさまざまなショートコードオプションを表示します。

QRコード」オプションを設定してください。

Select QR code shortcode

その後、QRコードの詳細を入力するオプションが表示されます。

データフィールドには、先ほど作成したStripe支払いフォームのURLを入力します。

そのほかに、コードのタイトルを入力するオプションがあり、これはaltテキストの役割を果たします。また、QRコードのサイズを調整することもできます。

Enter QR code details

下にスクロールすると、QRコードをカスタマイズするためのオプションが表示されます。例えば、原色や背景色などを変更することができます。

完了したら、「ショートコードを挿入」ボタンをクリックするだけです。

Click insert shortcode

このプラグインでは、ブログ投稿日やランディングページでコードのライブプレビューを見ることもできます。

ページを公開して、Stripe支払いフォームのQRコードを実際に見てみましょう。

QR code live preview

この投稿がWordPressでStripe QRコード決済を追加する方法のお役に立てば幸いです。WordPressで定期的な支払いを受け付ける方法と WordPressでビットコイン支払いを受け付けるチュートリアルもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

3件のコメントLeave a Reply

  1. Ralph

    Paying with QR code is more and more popular. I think it is becuase of its ease of use. It’s just faster than old methods and we want to save more and more time.

    I have a question – Scaning QR code with phone from laptop screen is easy, but is it also such a easy thing with smartphones themselves? I mean, i scroll website on my phone and see QR code, my phone do not recognize QR code like that, only with photo app. Is it normal or it’s just my phone and having qr code for mobile users is just as good as for desktop users?

    • WPBeginner Support

      It would depend on the phone, if you have not done so already you would want to try taking a screenshot with your phone.

      Admin

      • Ralph

        Oh, I did not think of that… Thank you for your suggestion, this should do the trick!

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.