どうも、まさとらん（@0310lan）です！
今回は、Webサイトやブログなどへプログラミング不要で簡単に決済機能を組み込むことができる無料のWebサービスをご紹介します！
埋め込みタグをHTMLに挿入するだけでGUIによる細かな設定が可能で、月額課金や寄付金の導入なども今すぐ始めることができますよ。
ショップサイトや有料サービスの開発を考えている人も参考になると思うので、ご興味ある方はぜひ試してみてください！
【 Payzard 】
■「Payzard」の使い方
それでは、まず最初に「Payzard」を使った決済機能を利用するための方法について見ていきましょう！
サイトにアクセスしたら、画面の上部にある「Start now」ボタンをクリックします。
決済機能を導入しようと考えているWebサイトのURLを入力します。
プラットフォームの選択画面になるので、今回は「Other platform」を選択します。
もし、「WordPress」や「Weebly」などを利用している方は、そのプラットフォームを選択してください。
次に、メールアドレスを入力します。
埋め込みタグが生成されるのでコピーしましょう！
あとは、HTMLの「headタグ」内の一番最後に貼り付ければOK！
Webサイトを更新すると、画面右側に「Payzard」の専用ボタンが表示されます！
このあと、決済機能の利用からボタンの生成まですべての作業がこのボタンからできます。
■「Payzard」の初期設定をしよう！
「Payzard」の専用ボタンが表示されたので、早速クリックしてみましょう！
すると、初回のみ必要な設定画面が表示されるので「Next」ボタンをクリックします。
簡単なチュートリアル動画が表示されますが、そのまま画面下にある「Sign up」ボタンをクリックしましょう。
先ほど入力したメールアドレスを設定します。
すると認証用コードがメールで送られてくるので、そのコードを設定してパスワードを決めれば完了です！
最後に「テストモード」で起動するかどうかを聞かれます。
「Payzard」は100種類を超える多彩な決済サービスと連携できるのですが、今回はサンプルとして利用するだけなので「Stay in test mode」ボタンをクリックしてテストモードにしておきます。
テストモードにすれば、決済機能を実際に試せますが支払いなどの処理は行われないのでサンプルとして試すには最適です。（この設定はあとから変更可能です）
画面を見ると、先ほどの専用ボタンの表示が変化していることに気づきます。
これは「Payzard」にログイン出来ていることを意味しており、2つほど増えたボタンにより決済ボタンの作成やアナリティクス画面を表示することができるわけです。
ちなみに、一定時間経過するか自分以外のユーザーがサイトを訪れると1つだけのボタン表示の状態に戻ります。
その時は、再度ログインすることで決済ボタンの作成などができるようになるのでご安心ください。
■決済ボタンを設置してみよう！
それでは、「決済ボタン」を作成してWebサイトに配置してみましょう！
まずは、Payzardのボタンから「＋」アイコンの表示があるボタンをクリックします。
次に、決済の種類を選択します！
1回の支払いで済ませる「買い切り」タイプと、月額課金を行うタイプと寄付金を得られるタイプがあります。
どのタイプも作り方はそれほど変わりませんので、今回は「買い切り」タイプの決済ボタンを作ってみたいと思います。
すると、決済ボタンをWebサイトへ設置する方法について聞かれます。
「Drag-n-Drop」が簡単で、マウスでWebサイトの設置したい箇所を選択するだけでOKです！
ボタンを設置すると設定画面が表示されるので、まずはボタンに表示する名称を入力します。
続いて、金額と商品名を入力！
決済画面に表示するロゴ画像などもアップロードできます！
次に、誰でも決済ボタンを利用できるようにするかを聞かれるので「Publish button」を選択しましょう。
ひとまず自分だけが利用できるようにする場合は「Keep button hidden」を選択します。
実際に決済処理をするかどうかを個別に設定できるので、今は「Test payments」を選んでおきましょう！
「Live payments」を選ぶと実際に決済処理されます。（あとで変更可能です）
Webサイトを確認すると「決済ボタン」が設置されているのが分かりますね！
ボタンをクリックすると決済画面が表示されます！
■便利なカスタマイズ設定について
「Payzard」には簡単にスタマイズ可能な設定が用意されているので、いくつかご紹介しておきます！
まずは、決済ボタンの編集モードから利用できる「Advanced settings」です。
これは、金額やボタン名称などを編集できるのはもちろんのこと、CSSを使ってボタンのレイアウトを自由にデザインすることができるのです！
独自のボタンを作成することで、自分のWebサイトのデザインに最適なボタンを作れるわけです。
また、「Payzard」ボタンから基本情報の設定もできます。
通貨や会社名などを設定しておくことで、決済ボタンを素早く作成できるようになります。
また、「Payzard」の専用ボタンについて表示・非表示を設定することも可能です。
初期表示の「Payzard」ボタンを非表示にすることでWebサイトのデザインを損なうことなく利用できます。
専用の「アナリティクス機能」もあります！
どのくらいボタンがクリックされたのか、売上の記録、期間ごとの集計など知りたい情報がすぐに分かるので便利です。
このように、「Payzard」利用すると誰でも簡単にサイトへ決済ボタンを設置して収益を得られるようになるので、ご興味ある方はぜひ試してみてください！
■動画でプログラミングが学べるpaizaラーニング
動画でプログラミングが学べるpaizaラーニングでは、Python、Java、C言語、C#、PHP、Ruby、SQL、JavaScript、HTML/CSSなど、プログラミング初心者でも動画で学べる入門レッスンを公開しています。
「Python入門編」「C#入門編」「JavaScript入門編」「ITエンジニアの就活準備編」といった人気講座も完全無料となっておりますので、プログラミングを学びたい方・ITエンジニアを目指したい方はぜひごらんください。
■まとめ
今回は、簡単にWebへ決済ボタンを作って設置できるサービス「Payzard」についてご紹介しました。
類似のサービスはいくつかあるのですが、現時点ですべての機能を無料で試せてマウス操作による簡単な設定だけで決済機能を組み込めるのは珍しいと思います。
月額課金や寄付金なども簡単にWebサイトへ設置できるので、これから課金処理を検討している方はぜひトライしてみてください！
「paizaラーニング」では、未経験者でもブラウザさえあれば、今すぐプログラミングの基礎が動画で学べるレッスンを多数公開しております。
詳しくはこちら
そしてpaizaでは、Webサービス開発企業などで求められるコーディング力や、テストケースを想定する力などが問われるプログラミングスキルチェック問題も提供しています。
スキルチェックに挑戦した人は、その結果によってS・A・B・C・D・Eの6段階のランクを取得できます。必要なスキルランクを取得すれば、書類選考なしで企業の求人に応募することも可能です。「自分のプログラミングスキルを客観的に知りたい」「スキルを使って転職したい」という方は、ぜひチャレンジしてみてください。
詳しくはこちら
