Gravity Forms Built-In Add-Ons
- Navigate to WordPress Admin Dashboard → Forms → Add-Ons.
- Now you’re on the Add-Ons page.
- These three Gravity Forms Built-In Add-Ons are compatible with Gravity Forms Bookings.
- Stripe
- Coupons
- Paypal
Stripe
- Click on the Install button on the Stripe add-on.
- Click on the Activate Plugin button.
- Now navigate to WordPress Admin Dashboard → Forms → Settings.
- Navigate to the Stripe tab.
- Select the mode according to your requirement in the Mode option.
- Click on the Connect with Stripe button.
- Make sure you’re logged in to your Stripe account.
- Click on the Connect button.
- Click on the View Instructions in the Webhooks Enabled heading while settings Webhooks.
- The URL will be highlighted in the third point of the instructions. Copy the URL and paste it while configuring the webhooks.
- Once the connectivity is done, enter the Signing Secret according to the Mode you’re in. Since we are in the Test Mode using, we’ll enter the Signing Secret key in the Test Signing Secret field.
- Once done, click on the Save Settings button.
- Once done, a notification will appear at the top titled “Settings updated”.
- Navigate to WordPress Admin Dashboard → Forms → Forms.
- Now you’re on the Forms page.
- Hover over the form and click on the Edit button.
- Now you’re on the Edit Form page.
- Navigate to the Settings tab and then click on the Stripe option.
- Now you’re on the Stripe Settings page.
- Edit the fields according to your requirement.
- Once done, click on the Save Settings button.
- Once done, a notification will appear at the top titled “Settings updated”.
- Now click on the Edit tab at the top of the page.
- Now you’re on the Edit Form page.
- Go to the Pricing Fields section on the right-hand side of the page.
- Drag and drop the Stripe Card field on the form.
- The Stripe field now appears on the form.
- Customize the fields according to your requirement.
- Click on the Save Form button.
Front-End Impact
- The Customer will navigate to the website.
- Go to the Bookings Form page.
- Select the Location, Service, and Staff according to the configuration mentioned above.
- Now, a calendar will appear. Select the date on the calendar accordingly.
- Now select the slot on that specific date.
- Enter the Card details in the Stripe Credit Card section.
- The total amount will appear in the Total section.
- Once done, click on the Submit button.
- Once the Booking is successful, a message will appear on the form page.
- Now go to your Stripe dashboard.
- Go to the Payments tab.
- We can see the payment with all the details.
- The status of the payment will be Succeeded.
- Click on the entry to view further details.
- Click on the entry to view further details.
NOTE: The Status of the payment will be Succeeded in the Stripe dashboard because the appointment status will be Confirmed by default in the Appointments section.
Coupons
- Click on the Install button on the Coupons add-on.
- Click on the Activate Plugin button.
- Navigate to WordPress Admin Dashboard → Forms → Forms.
- Now you’re on the Forms page.
- Hover over the form and click on the Edit button.
- Now you’re on the Edit Form page.
- Go to the Pricing Fields section on the right-hand side of the page.
- Drag and drop the Stripe Card field on the form.
- First, drag and drop the Product field on the form.
- Once done, now drag and drop the Coupon field on the form.
- Once done, click on the Save Form button.
- Now, the Coupon field will work properly on the form.
- We can now delete the Product field on the form.
- Once done, now click on the Save Form button.
Front-End Impact
- Navigate to the website.
- Go to the Bookings Form page.
- We can see the Coupon field on the form page.
NOTE: It is mandatory to drag and drop the Product field first from the Pricing fields, then drag and drop the Coupon field from the Pricing fields and click on the Save Form button on the form.
Once done, you can delete the Product Product field from the form.
Other Compatible Add-Ons
- Gravity Forms Bookings is compatible with the following add-ons:
Square
- Navigate to WordPress Admin Dashboard → Forms → Forms.
- Now you’re on the Forms page.
- Hover over the form and click on the Edit button.
- Now you’re on the Edit Form page.
- Navigate to the Settings tab and then click on the Square option.
- Now you’re on the Square Settings page.
- Select the mode according to your requirement in the Mode option.
- Click on the Connect with Square button.
- If you’re not logged in to your Square account, you’ll be redirected to the Square login page.
- Enter the credentials of your Square account and log in.
- An authentication page will appear if you’re already logged in to your Square account.
- Click on the Allow button.
- Once done, click on the THAT’S MY SITE – REDIRECT ME button to complete the connection.
- Once the connectivity is done, select the Location from the dropdown menu.
- Enter the Application ID, Access Token, and Location ID of your Square Application.
- Once done, click on the Save Settings button.
- Once done, a notification will appear at the top titled “Settings updated”.
- Now you’re on the Edit Form page.
- Go to the Pricing Fields section on the right-hand side of the page.
- Drag and drop the Square CC field on the form.
- The Square CC field now appears on the form.
- Customize the fields according to your requirement.
- Click on the Save Form button.
- Front-End Impact
- The Customer will navigate to the website.
- Go to the Bookings Form page.
- Select the Location, Service, and Staff according to the configuration mentioned above.
- Now, a calendar will appear. Select the date on the calendar accordingly.
- Now select the slot on that specific date.
- Enter the Card details in the Square Credit Card section.
- The total amount will appear in the Total section.
- Once done, click on the Submit button.
- Once the Booking is successful, a message will appear on the form page.
- Now go to your Square dashboard.
- Go to the Transactions tab in the Sandbox since we were in Test mode.
- All the transactions will appear in this tab.
- Click on the transaction to view its details.
- All the details of that specific transaction will appear on the right-hand side of the page.
NOTE: The Status of the payment will be Succeeded in the Square because the appointment status will be Confirmed by default in the Appointments section.
