To add fena account-to-account payments to your Shopify Plus store, just follow the instructions below.
Table of Contents
Before you get started
Please note: This app requires some technical knowledge to install as there are some code changes required. Please also ensure to test end-to-end after installation.
The app is installed as a manual payment method. This means that the order is confirmed prior to the payment being made. However, the payment status against the order will still update automatically once payment is made so doesn’t require manual updates.
When the order is placed, you and your customer will receive the standard order confirmation emails. We have included instructions to edit the customer’s email so for fena payments, the email copy reflects the fact the order will be processed only once payment is complete.
In the email you receive, if it’s a Fena payment the payment method will show as “Pay By Bank” (unless you update the name, in which case it will display with the name you’ve set). For these orders, as the order is confirmed prior to payment completing, you should double check the payment status in your admin panel before processing the order.
Send fena your store URL
To get started, you need to provide fena with your store URL - this should be in the myshopify.com format. You can email this to [email protected]. Once we have this, we will generate an installation link for you.
Install the payment app
Step 1:
Provide the myshopify.com shop url to fena you can send the mail to [email protected] we will create a custom installation link for your shop.
Step 2:
Then copy the link sent to you by fena to install the app in store. firstly login to the admin of the shop.
Then hit the copied link and you can install the app. Please check screenshot.
Once you have installed the app you will be asked for a terminal ID and secret. This is where you will configure your integration. Follow the steps below:
Firstly login to (or register for) your fena account (https://business.fena.co/login/) and go to settings > integrations
Create an integration with the desired name. As you go through the steps, you’ll be asked for a Webhook URI and Redirect URI
After the installation we need to add the Fena payment details here.
Then we need to create a custom payment method for fena. Follow the below steps.
Click on 'Settings'
Choose 'Payments' in the navigation bar on the left hand side
Then, scroll down to 'Manual payment methods' and click on 'Add manual payment method'
Step 3. Steps to setup the Checkout UI Extension
this requires a technical knowldge if you can easily go through the steps its ok otherwise you can provide the colaborator access to us and we will do these steps for you.
Note: these steps are required by stores whose checkout Additional Scripts are disabled and they have Shopify Plus and also Checkout Extensibility is enabled.
Open the terminal in which folder you want to setup the code and run the below command
npm init @shopify/app@latest
Add your project name and run the below commands:
For example:- Fena-test
It will install dependencies required to set up the extension
After that run the below commands:
cd {fena-test}
{fena-test} is folder that we created above.
Then, run the below command
npm run shopify app generate extension
Select your Plus Store
For example: you have selected the {fena} store form the list.
Note: if you are doing it for the first time, you will have to connect the shopify partner account on which the store is present so when you will run
npm run shopify app generate extension
it will ask you to login to partners account, just press any key it will redirect you to browser login to partner account and provide access to Shopify CLI. it will automatically be done once you login on browser you can close the tab and then re run
npm run shopify app generate extension
now your stores will start appearing in the list select the one you want to install the app.
Select the option either or will want to install extension on existing app or want to create new extension.
Note: You should select the “existing app” option as it is better to create app manually in Shopify and then select that app here.
Select the type of extension you want to install on it
For instance: You could select the checkout UI as per the requirement.
Add the name of your extension like: checkout-ui
Select the technology on which you want to make the extension
For instance: Javascript React or similar
Then you need to visit this repo
https://github.com/fena-co/checkout-ui-Shopify-code
and copy the codes from checout.jsx and Shopify toml
to your app the checkout.jsx and Shopify.toml file just copy and paste these codes save it.
After selected the above options run the below command to install the extension on your app.
Npm run deploy
Note: This extension will run for the single app. You need to create a separate extension for a separate app.You need to follow the above steps again for each app.
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article