1. Build Integration

Steps to integrate your WordPress website using the Gravity Forms plugin.

Know how to integrate Razorpay Payment Gateway to your WordPress website using the Gravity Forms plugin.

Integration Steps🔗

Follow these steps to complete the integration:

  1. Download the Razorpay Gravity Forms plugin and configure settings.
  2. Create a Gravity Form.
  3. Add Form in Webpage.

Step 1: Download Razorpay Gravity Forms Plugin and Configure Settings🔗

Follow the steps given below:

  1. Download and install the Razorpay Gravity Forms Plugin. You can do this using either of these methods:

  2. On your WordPress site, activate the plugin in the WordPress Plugin Manager.

  3. Click Settings.

  4. Configure the following information and click Update Settings:

    • Add in your [KEY_ID] and [KEY_SECRET] generated from the Razorpay Dashboard.
    • Payment Action: Set this to Authorize and Capture.
  5. Select the currency in which the payment must be accepted.

    1. Navigate to FormsSettings.
    2. Under General Settings, go to the Currency field and choose the relevant currency. For this example, we will select Indian Rupee.

Step 2: Create a Gravity Form🔗

To create a Gravity Form:

  1. Navigate to FormsNew Form and click Add New.

  2. On the Create a New Form dialog box, enter the form title and description.

  3. Click Create Form.

  4. Before entering the product details, you must select whether you are selling a subscription or a product/service. Navigate to SettingsRazorpay and configure the Razorpay Feed.

    1. In the Razorpay Feed settings, click Add New.
    2. Add a name for the feed. For example, Ooty Green Tea.
    3. Select Products and Services as the Transaction Type.
    4. Click Update Settings.
  5. Click Edit to start adding product details:

    1. Click Pricing Fields and select Product.

    2. Click the form to enter the product details and click Update.

      1. Field Label: Enter the product name. For example, Ooty Green Tea.
      2. Description: Enter a description for the product.
      3. Field Type: Select field type as required.
      4. Price: Enter the product price in INR. For example, 399.99.
      5. Disable Quantity Field: Do not select this option if you want your customer to select a quantity.
      6. Rules: Enable the Required check box to make the quantity field mandatory.

The form is now ready to be added to your webpages.

Step 3: Add the Form to a Webpage🔗

To add the form on a webpage:

  1. Click Pages to navigate to the relevant page.

  2. Add a block and click the form icon.

  3. Select the form to be added to the page.

  4. Once the form is added, you can choose to hide the form title and description.

  5. Click Publish or Update.

Handy Tips
Webhook is auto-configured when you enter and save the API key ID and secret on the plugin settings page. You need to verify if webhooks are enabled on your Razorpay Dashboard. However, for versions lower than 1.3.2, you need to configure webhooks manually.