コンテンツ

支払いフィールドの使用例

Calculoidは、支払済プランの支払フィールドを提供します。 PayPal(またはStripe)アカウントに直接接続することができます。 Calculoidはあなたの電卓で行われた支払いから何の手続きもしません。 プロジェクトを構成して使用する方法を見てみましょう。

あなたの顧客が計算したものを支払わせる

支払フィールドで、あなたの電卓はショッピングカートになります。 もちろん、大きな電子商取引ソリューションのソリューションではありません。 しかし、Calculoidが支払いツールとして最適なソリューションである場合があります。 次の例を考えてみましょう。

小さなベーカリー

小さな家族向けベーカリーは5タイプのケーキを専門としています。 各ケーキの価格は、ケーキの大きさ、トッピング材料、異なる詰め物の成分によって異なります。 この場合、電卓を作成し、テキストフィールドを2つ入れて顧客の住所と納期を得てから、顧客が価格を計算してカスタムケーキを直接支払うようにするのは難しくありません。 その後、4をコピーして、それぞれのケーキのタイプに合わせてもっと多くの時間を変更してイラストの写真をあなたのウェブサイトに埋め込み、eコマースのソリューションを準備します。

マーケティング代理店

各タスクの専門家の時間を販売するマーケティングエージェンシーを想像してみてください。 彼らはグラフィック、Web開発者、コピーライター、PPC専門家、プロジェクトマネージャーを持っています。 各エキスパートは毎時のレートが異なります。 また、数量割引を提供したいと考えています。 この場合、電卓には各エキスパートのチェックボックスと、エキスパートの時間を購入したい時間のスライダーがあります。 そのため、顧客はプロジェクトのコストがどれだけ高いかを簡単に計算でき、ボタンをクリックするだけで購入できます。

支払いフィールドでは、カスタム商品やサービスを販売することができます。 顧客は自分が必要とするものを正確に設定できます。

主要な電子商取引機能

Calculoidは、有料ボタンだけでなく、電子商取引のニーズを満たすためのより多くの機能を提供します。

  • 支払いは、支払いカードで処理することができます。 ストライプペイメントゲート または経由 PayPal.
  • あなたと顧客は パーソナライズド電子メール すべての電卓のフィールド値での支払いについて。
  • 注文リスト すべての顧客と支払いの詳細と レビューをみる。 各計算機ごとに。
  • 注文も可能です CSVでエクスポート MSなどのスプレッドシートプロセッサで開くことができます Excel.
  • Webhooks 注文データをリアルタイムで処理することができます。 情報をCRMまたは請求書発行アプリに送信します。
  • 私たちはまた、セットアップが簡単な統合に取り組んでいます。 Redmineの.

支払フィールドの設定

支払いフィールドを設定してテストするために支払う必要はありません。 このフィールドは、無料プランで利用可能です。 あなたがログインしているときだけ、あなたのためだけに表示されることはありません。他の人には表示されません。

1。 ログインまたは登録

まだ登録していない方は、ぜひご登録ください!

2。 新しい電卓を作成する

「計算機」に移動して、「新しい計算機」ボタンをクリックしてください。または、支払い計算機として使用したい計算機を編集することもできます。あるいは、既存の計算機をコピーすることもできます。頭の中で思い描いているものと似た計算機が見つかれば、時間を節約できるかもしれません。

3。 支払フィールドを追加する

あなたはこのような支払いフィールドを見つけることができます:

calculoid-add-payment-field

「支払い」フィールドタイプをクリックしてください。新しいフィールドが計算機に追加されます。

4。 フィールドの編集

電卓に追加するフィールドのタイプを選択すると、そのフィールドがフィールドに追加されるので、次のように表示されます。

calculoid-payment-field

フィールドを移動すると、さらに多くのオプションが表示されます。 数式にとって重要なフィールドIDが表示されます。 このフィールドの編集フォームを開く編集ボタンがあります。 それからあなたはフィールドを動かすことができるハンドルがあります。 そこにフィールドが1つしかないときは、今のところ関係はありませんが、後で役に立ちます。 また、フィールドの端を越えると、サイズを変更できるようになります。

5。 計算するフィールドをいくつか追加

これで支払いフィールドはできましたが、支払う金額がありません。金額を計算するために、さらに2つのフィールドを追加しましょう。「フィールドの追加」タブを再度開き、ラジオボックススライダー数式フィールドを追加します。結果は次のようになります。

calculoid-raw-fields

6。 電卓のレイアウトを変更する

そのような小さな電卓に必要なスペースは十分です。 サイズ変更機能を使用してサイズを小さくしましょう。 たとえば、次のようになります。

石灰化収縮

7。 フィールドオプションを編集する

ラジオボックスとスライダフィールドを編集して、顧客のために選択できるオプションを追加しましょう。 私はSaaSアプリのための電卓を用意しています。ここでは、3の選択肢とユーザー数があります。 ここでは編集オプションのすべてを表示しません。 上記のように編集ボタンをクリックすると、利用可能なオプションが表示されます。

8。 数式を構築する

数式がどのように構築されているかを詳しく見ていきましょう。数式フィールドを編集し、名前を付け(私は「最終価格」と名付けました)、接頭辞($)、接尾辞(/月)を付け、フォントを大きくしたり、好きなようにスタイルを設定したりします。数式フィールドと計算機全体の核となるのは、数式そのものです。顧客が情報を入力できるフィールドが 2 つあります。これらのフィールドの値を単純に掛け合わせたいのです。各フィールドには一意の ID があります。したがって、私たちの数式は「プランを選択してください」 * 「必要なユーザー数はいくつですか?」 = F40981 * F40982です。現在の値をそこに加算すると、20 * 5 = 100 になります。計算機は正しくカウントしているようです。それでは、支払いフィールドに戻って設定しましょう。

calculoid-formula-edit

9。 支払フィールドの設定

重要なのは、支払いフィールドを価格を保持するフィールドにリンクすることです。 これは、支払フィールドを編集して利用可能な項目から項目を選択することで簡単に行うことができます。

calculoid-payment-edit

これで、支払ボタンに同じ数値が表示されます。 残りのフィールドは、彼らが何をするのかを推測するのが簡単です。 最後のステップであるPayPalの設定を考えてみましょう。

10。 PayPalの設定

支払いフィールド設定で[PayPal]タブを開きます。

calculoid-paypal-edit

ここにフィールドを置くと、それが意味することがより詳しく説明されますので、ここでワークフローについて説明します。 PayPalは、支払いをテストするためのテスト用の支払いゲートを提供しています。 これにより、プロセス全体が正常に動作していることを知ることができます。また、実際に支払いを受け取ることができます。 ここにあなたがすべきことがあります:

  1. ログインする sandbox.paypal.com テスト用の顧客を作成します。 を見てみましょう PayPalのテストガイド より多くの情報が必要な場合。
  2. PayPal支払いテストでPayPalゲートにリダイレクトされ、保存されていない設定が失われる可能性があるため、電卓を保存したことを確認してください。
  3. ここで、支払いフィールドの電子メールエリアにテスト用のメールアドレスを挿入します(設定フィールドではなく、支払いフィールドの実際のメールフィールド...これはちょっと混乱します)。支払ボタン。 これにより、サンドボックスの支払いゲートにリダイレクトされます。このゲートでは、ステップ1で作成したテスト用の顧客の電子メールを挿入し、支払いを進めることができます。
  4. すべてがうまくいったら、プロダクションゲートに切り替えて、後で忘れないようにしてください。 私はそれをやった;)

その他の可能性

おそらく、作成した電卓をウェブサイトに埋め込みたいと思うでしょう。電卓の設定を行い、「完了」としてマークすることを忘れないでください。埋め込みを機能させるには、これらの設定が必要です。

これでPayPal決済計算機は完成です。しかし、 Stripe決済ゲートウェイ経由で顧客がクレジットカードで支払えるようにしたい場合もあるでしょう。送信/注文は一覧表示したりダウンロードしたりできます。注文を他のサービスと連携させたい場合は、Webhookを確認してください。このチュートリアルの手順で迷った場合や質問がある場合は、お問い合わせください

計算機の例

このチュートリアルで作成した、実際に動作する電卓をご覧ください。もしこれをコピーしてご自身の電卓のベースとして使用したい場合は、こちらから入手できます:http://app.calculoid.com/#/calculator/7595

追加情報

今すぐ無料で開始

数分で独自のWeb電卓を作成してください。
30-dayフリートライアルのすべての機能をテストします。 

無料サインアップ

クレジットカードやインストールは必要ありません