How to create a UI form in payment configuration?

[Jindo1]

I am having trouble creating UI form in payment configuration, can't find any related documentation about this. Can you guys help me. I want to follow the picture below, thank you

[Rick]

Hi @Jindo1 

Thanks for reaching out here, and welcome to the Shopify Community.

It looks like you are trying to set up the Razorpay payment gateway on your store - I'd be happy to help steer you in the right direction.

Razorpay is a third-party payment gateway, which means it is external to Shopify. To use Razorpay, you would need to have your own account with them. They would supply the account information required to set up the gateway on Shopify, which in this case is an API Key ID & Key Secret. This information is private and account specific and is used to link your Razorpay account to your Shopify store.

If you are having trouble finding this information in your Razorpay account, I would recommend contacting their support team and they should be able to help you out with that. I would also suggest taking a look over our own help documents about third-party gateways, as they contain some great information which should help clarify things for you.

Besides this payment gateway setup query, how is the rest of your store setup going? If you need some guidance about the steps involved in getting set up to start selling, we have a newly released official YouTube tutorial video for 2023 here. It's a great visual guide that you can use as a reference for the various setup steps!

[Jindo1]

As we are building the payment app therefore when the merchant install the app will need to verify some information such as API Key, etc.. per the guidance:

https://shopify.dev/apps/payments/getting-started/onboard-a-merchant-payments-apps

Currently, We have configured the flow when user clicks "Manage" will be redirected to the App's configuration page (Built by Shopify CLI)

Opening the app after clicking "Manage" also mentioned in this doc: https://help.shopify.com/en/manual/payments/additional-payment-methods?shpxid=525f61c6-2F93-43A2-A53...

However, our client needs to get this API form(Shopify's form) directly to the app's configuration page. We have found some users in the forum have successfully implemented this but not sure how they did it.

Currently, This form is separated in another tab.

Looks like they have to embedded the form into the third party application then integrate the whole thing into the Apps

[Rick]

Hi @Jindo1 

Apologies for the delay in replying to your followup message.

I understand now that you are developing a payment app on Shopify and have some questions about implementing the API form into your app.

I am not actually a developer myself, so I am not in a position to be able to support these kinds of technical queries. With that in mind, I think it would be a good idea to consult the Shopify payment app developer resources here, as they contain a lot of technical information about creating payment apps and integrating them with Shopify.

If you are still having difficulty figuring this specific feature out, then I would suggest heading over to the dedicated Partners & Developers section of the Shopify Community and creating a new post there outlining your questions about the API page for your payment app. There are a lot of other Partners and developers there that may be able to assist you with this. You mentioned that you found other users who did this - perhaps replying to their posts, or sending them a message would be helpful.

You can also consider joining the Shopify Partner Facebook group and Slack channel - you will find links to these in the Support tab of your Partner dashboard. If you prefer to use Discord, then you can head on over to the Shopify Devs Discord channel here.