UChat Official

Introduction

In this comprehensive guide, we explore how to seamlessly integrate local payment gateways into your UChat workflows.

The video primarily discusses native support for popular payment options like Scribe and Paper, along with a variety of other gateways such as Visa Pay, Stripe, Razorpay, and Hit Pay.

The focus is on leveraging UChat’s visual flow builder to create efficient, automated payment processes, with a detailed walkthrough on setting up Razorpay for checkout and order management.

This summary provides a structured, detailed overview, enriched with formatting to enhance clarity and understanding.

Step-by-Step Guide to Using Razorpay with UChat

1. Accessing and Installing Payment Gateway Apps

  • Navigate to Media Apps:
    In UChat, go to the Media Apps section to explore available mini apps.

  • Install Payment Gateways:
    Click Install on desired apps such as:

    • Visa Pay

    • Stripe

    • Razorpay

    • Hit Pay

  • Build with Visual Flow Builder:
    These mini apps can be integrated effortlessly using UChat’s visual flow builder, enabling automation without extensive coding.

2. Setting Up Razorpay

  • Install Razorpay Mini App:
    After installation, access Razorpay settings within UChat.

  • Obtain API Keys:

    • Log into your Razorpay Dashboard.

    • Navigate to Settings > API Keys.

    • Copy Key ID and Secret Key (test or live as needed).

  • Configure in UChat:
    Paste these API keys into the Razorpay mini app settings in UChat to enable integration.

3. Creating Payment Links and Automations

  • Generate Payment Links:
    Use UChat’s Actions to create standard payment links via Razorpay.

  • Set Up Triggers:

    • Create triggers to:

      • Complete the message flow (e.g., order confirmation).

      • Update order status in your system.

  • Template Access:
    You will receive pre-built templates for these flows, which can be customized as needed.

4. Building the Payment Flow

  • Flow Overview:
    The flow involves:

    • Receiving an order.

    • Generating a checkout link.

    • Sending the link to the user.

    • Handling post-payment updates.

  • Step-by-Step Breakdown:

Step

Action

Description

1

Save Order ID

Store the order ID in a custom field for tracking.

2

Create Payment Link

Use Razorpay’s create standard payment link action.

3

Configure Payment Details


 

- Order Total Price

Retrieve from your order system fields.

 

- Description

Add optional descriptions or user info.

 

- Currency

Set to local currency (e.g., INR).

4

Save Link Details

Store the generated checkout URL and link ID in custom fields.

  • Generating the Checkout URL:
    The URL generated is used to redirect users to Razorpay’s checkout page, where they can complete their payment securely.

5. Implementing the Payment Link in User Flow

  • Display Checkout Link:
    Send the checkout URL to the user within the chat, allowing them to pay directly.

  • Post-Payment Handling:
    After payment, trigger actions to:

    • Confirm the order.

    • Update order status.

    • Send confirmation messages.

6. Practical Example of Flow Construction

  • Flow Components:

    • Order Received Trigger: Initiates the process when a user places an order.

    • Order ID Storage: Ensures each transaction is uniquely tracked.

    • Payment Link Generation: Creates a Razorpay checkout link with order details.

    • User Notification: Sends the checkout link to the user.

    • Order Confirmation: Upon successful payment, updates order status and sends confirmation.

  • Automation Triggers:

    • Connect the "Order Received" trigger to the flow.

    • Use "Payment Completed" trigger to finalize the order.

7. Additional Customizations and Tips

  • Adding Descriptions and User Info:
    Enhance the checkout experience by including:

    • User’s name.

    • Order details.

    • Custom messages.

  • Currency and Localization:
    Ensure the currency matches your local market (e.g., INR for India).

  • Storing Data:
    Use custom fields to store:

    • Order ID.

    • Checkout link.

    • Payment status.

  • Security Considerations:
    Always test with test API keys before going live.

Final Thoughts and Next Steps

Integrating local payment gateways like Razorpay into UChat empowers businesses to automate transactions efficiently, providing a seamless experience for users. The process involves installing the relevant mini app, configuring API keys, creating payment links, and automating order updates through triggers and flows. This setup not only streamlines payments but also enhances customer trust and operational efficiency.

In the upcoming tutorials, you'll learn how to complete orders and update order statuses post-payment, further refining your e-commerce automation.

Summary Table: Key Steps for Razorpay Integration

Step

Action

Purpose

1

Install Razorpay mini app

Enable Razorpay features in UChat

2

Obtain API keys

Authenticate API requests

3

Configure API keys in UChat

Connect Razorpay with your chatbot

4

Create payment links

Generate checkout URLs dynamically

5

Store order info

Track transactions and IDs

6

Send checkout link to user

Facilitate payment completion

7

Automate post-payment actions

Confirm order, update status

Final Remarks

By following this structured approach, you can effectively integrate Razorpay or other local payment gateways into your UChat workflows. This not only simplifies the payment process but also enhances the overall customer experience, leading to increased conversions and operational efficiency.