Before installing and connecting the module, ensure you have downloaded the Yotta Pay app and activated the business plan.
If you haven't done so already, please refer to this page for instructions. Once you have registered, you can proceed with the installation of the module.
1. Log in to Wix dashboard.
2. Navigate to the Home page from the left panel menu, then select Edit Site to open the Wix Website Editor.
3. Click on the Dev Mode tab located in the top panel, then click the Turn On Developer Mode button.
4. Next, click on Packages & Apps in the left panel menu.
5. Click + Install packages from npm in the npm section. The Package Manager window will be opened.
6. Type uuid into the search bar. Once the package appears in the list of packages, click on it, then click the Install button.
7. Wait for the installation process to finish, then close the Package Manager. The uuid package will now be available in the npm section.
8. Click on Public & Backend in the left panel menu.
9. Navigate to the Backend section and select + Add web module. Enter the module name as yottapay-backend.web.js.
10. Go to the file system and locate the file path: yottapay-payments\Backend\yottapay-backend.web.js. Then, copy the contents of the file.
11. Return to the Wix Website Editor and replace all the contents of the module Backend\yottapay-backend.web.js with the copied content.
12. Check the Backend section again. If the module Backend\http-functions.js does not exist, point to the Backend section, then click on the plus sign (+) and select Expose site API. The module Backend\http-functions.js will be automatically created. If the module already existed previously, be careful not to overwrite it.
13. Go to the file system and locate the file path: yottapay-payments\Backend\http-functions.js. Then, copy the contents of the file.
14. Return to the Wix Website Editor and completely replace or add the contents of the module Backend\http-functions.js with the copied content.
15. Navigate to the Custom Extensions section, then click on the plus sign (+) and select Add Payment SPI.
16. Set the extension name as yottapay and click Add & Edit Code. Modules yottapay-config.js and yottapay.js will be automatically created.
17. Navigate to the file system and locate the file path: yottapay-payments\CustomExtensions\payment-provider\yottapay\yotta pay-config.js. Copy the contents of the file.
18. Return to the Wix Website Editor and replace all the contents of the module Custom Extensions\payment-provider\yottapay\yottapay-config.js with the previously copied content.
19. Navigate to the file system and locate the file path: yottapay-payments\CustomExtensions\payment-provider\yottapay\yotta pay.js. Copy the contents of the file.
20. Return to the Wix Website Editor and replace all the contents of the module Custom Extensions\payment-provider\yottapay\yottapay.js with the previously copied content.
21. Click Save in the upper right corner and wait for the process to complete successfully.
22. Click Publish in the upper right corner and wait for the process to complete successfully.
1. Log in to Wix dashboard.
2. Hover over Developer Tools in the left panel menu, then click Logs.
3. In the View site events section, click on Open (open in a new tab so the current page stays open).
4. In a new tab, navigate to your Wix dashboard again.
5. Click on Settings in the left panel menu, and then select Accept payments.
6. Select See More Payment Options at the bottom of the page.
7. Locate Apple Pay, Cards, Mobile Banking | Provided by Yotta Pay® in the list and click on Connect.
8. In the Account Information section, type in your Shop URL (not your dashboard!) and click on Connect at the bottom of the page. You will see "Yotta Pay® is Connected!" message.
9. Return to the Logs tab you opened earlier. Find the message "Log in with Yotta Pay" and copy the link to authorisation. Keep this tab opened.
10. Open the copied link in a new tab. The Yotta Pay authorisation page will open.
11. Scan the QR code on the authorisation page with your mobile device camera app.
12. The QR code will redirect you to the Yotta Pay application. Once redirected, you will be prompted to perform authorisation. Click Allow to grant access to the module.
13. If you manage several Wix sites, you may be redirected to the Wix Site Selector. Select the appropriate site for which the authorisation was initiated.
14. After that, the Secrets Manager page will be opened. Keep this tab open.
15. Return once more to the Logs tab you opened earlier. If you've closed this tab, unfortunately, you'll need to repeat the Primary initialisation process from the beginning, ensuring not to miss any steps. If repeating the Primary initialisation, in step 9, simply click Disconnect Yotta Pay before clicking Connect again.
16. Find a message that starts with "YOTTAPAY_USER_TOKEN" and copy the value after the colon.
17. Return to the Secrets Manager page. Find "YOTTAPAY_USER_TOKEN" in the Site Secrets list and click the pencil icon to edit it.
18. In the opened window, click Retrieve Value, then click the eye icon to reveal the value. Replace it with the copied YOTTAPAY_USER_TOKEN.
19. Click the " button and then again to confirm. A "'YOTTAPAY_USER_TOKEN' was successfully updated" notification will be shown. Keep this Secrets Manager tab opened.
To connect Stripe to your Wix Faster Checkout module, follow this guide. Once connected, the module will automatically use your Stripe settings for processing orders.
If you have your Loyalty program set up, you can also enable it in the Faster Checkout module. For that, you'll need to add a custom section to the Thank You page.
1. Ensure the Loyalty program is enabled in the Yotta Pay App by navigating to Business > Loyalty program > Enable loyalty program.
2. Log in to Wix dashboard.
3. Navigate to the Home page from the left panel menu, then select Edit Site to open the Wix Website Editor.
4. Click on Page Code in the left panel menu, then select Thank You Page from the Store Pages section. The page will be opened for editing. If the page code was already configured previously, be careful not to overwrite other code from previous steps.
5. Navigate to the file system and locate the file path: yottapay-payments\StorePages\ThankYouPage\code.js. Then, copy the contents of the file.
6. Return to the Wix Website Editor and replace all content of the Thank You Page with the copied code.
7. Within the left menu in the page constructor area click Add Section.
8. Add a Text section.
9. Select an element with plain background, white text with a title and two lines of text.
10. Add the section. It will then appear on the top of your page.
11. Click on the added text section, then click Change Background. Next, navigate to Colour tab, click + Add in the My colours area, ensure HEX is selected, type colour code "#00A0FF", and click Apply. Finally, select the new custom colour in the My colours tab.
12. Ensure that the section element ID is #Section1Regular. Check if subtitle element ID is #Section1RegularSubtitle1. Also, ensure that the longtext element ID is #Section1RegularLongtext1. If any of these IDs are different, locate the Element IDs area in the page code pasted earlier and change the constant values to match the actual ones.
13. The setup is now finalised. The content of the added section will be changed automatically when the page is loaded, based on the loyalty program settings in your Yotta Pay app. If you don't have the program set, this section will be hidden.
14. Click Save in the upper right corner and wait for the process to complete successfully.
15. Click Publish in the upper right corner and wait for the process to complete successfully.
1. Log in to Wix dashboard.
2. Navigate to the Developers Tools in the left panel menu, then select Triggered emails.
3. Include your sender details, such as the sender's name and reply-to email address, and enter the email confirmation code.
4. In the Triggered emails tab, click the + Create New button.
5. Remove all elements from the email body, except for one required text element, whose contents can be erased.
6. Click Add in the left panel menu, then select HTML in the shown Add elements list. The Customise HTML tab will be opened.
7. Navigate to the file system and locate the file path: yottapay-payments\TriggeredEmails\LoyaltyProgram\template.html. Then, copy the contents of the file.
8. Paste the copied HTML into the Customize HTML tab, then click Apply.
9. Click Edit in the subject line and set the value as “Congratulations! You have earned a £${AMOUNT} reward!”. Save changes.
10. Click on Save & Continue in the upper right corner and wait for the process to complete successfully. A window confirming that the email was successfully published will be displayed.
11. Click Copy to copy Email ID.
12. Navigate to the Secrets Manager tab that was opened previously, or alternatively, navigate to your Wix dashboard, hover over Developer Tools in the left panel menu, and then click on Secrets Manager.
13. Find YOTTAPAY_EMAIL_LOYALTY in the Site Secrets list and click the pencil icon to edit.
14. In the opened window select Retrieve Value, then click the eye icon to show value and replace it with a copied Email ID.
15. Click Change, and then confirm. A notification will be shown: "'YOTTAPAY_EMAIL_LOYALTY' was successfully updated.".
The version update is performed by a new installation. You need to repeat steps 11-22 from the Installation section.
1. Log in to Wix dashboard.
2. Click on Settings in the left panel menu, and then select Accept payments.
3. Locate ApplePay, Cards, Mobile Banking | Provider: Yotta Pay® and click Manage.
4. Disable Accepting payments.
5. Confirm action by clicking Turn Off in the popup.
6. Click Disconnect Yotta Pay®.
7. Confirm action by clicking Disconnect in the popup.
8. Click on Developer Tools in the left panel menu, and then select Secrets Manager.
9. Remove the following items in order: YOTTAPAY_EMAIL_LOYALTY, YOTTAPAY_USER_TOKEN, YOTTAPAY_USER_ID, YOTTAPAY_SHOP_BASE_URL, YOTTAPAY_DEBUG_MODE.
10. Go to the Home page and click Edit Site.
11. Ensure Developer Mode is enabled: select the Dev Mode tab from the top panel and click Turn On Developer Mode if it's available.
12. Next, click on Packages & Apps in the left panel menu.
13. Open the Custom Extensions section, then go to the payment-provider folder and click Delete next to the yottapay folder.
14. Confirm your action in the popup window.
15. Click Delete next to the yottapay-backend.web.js in the Backend section.
16. Confirm your action in the popup window.
17. Click Save in the upper right corner and wait for the process to complete successfully.
18. Click Publish in the upper right corner and wait for the process to complete successfully.
If you require any support, feel free to reach out to us at dev@yottapay.co.uk. We're here to help!
