In this article you will find:
A few things to verify before you set up the integration
How to implement the Rise.ai gift card experience within Tapcart
How to make the Rise gift card button visible only on the gift card product page
Please note:
The Tapcart integration is only available if you are on the Enterprise plan.
A few things to verify before you set up the integration
To start with, please ensure the following is already set up:
Both Rise.ai and Tapcart are installed on your Shopify store
The Rise.ai gift card product is already created (Shopify admin -> Products)
If the Rise gift card product is not created yet, please follow this article
You already got your Rise.ai Tapcart API token.
If not, please reach out to the Rise.ai Support team ([email protected]), or your dedicated Account Manager.
How to implement the Rise.ai gift card experience within Tapcart
1. Create a dedicated custom block
Within Tapcart, go to Home -> 'Custom' -> and then Click 'Launch Blocks Editor':
2. Paste the relevant code to each of the block's tabs
Once the dedicated block has been created, you will need to paste a different piece of code in each of the following tabs - HTML, CSS, and JS.
HTML: needs to be pulled from the 'index.html' section in this page. Simply copy the text and paste it within the custom block's HTML tab.
CSS: needs to be pulled from the 'styles.css' section in this page. Simply copy the text and paste it within the custom block's CSS tab.
JS: needs to be pulled from the 'scripts.js' section in this page. Simply copy the text, paste it within the custom block's JS tab, and edit in the API key you've received from Rise.ai, and your Shopify URL.
If you have not received your Rise.ai Tapcart API key yet, please reach out to the Rise.ai Support team ([email protected]), or to your dedicated Account Manager.
Important note:ย within this specific piece of code, there are designated placeholders in which you need to insert your Shopify URL and the API key you should have received from the Rise.ai team.
3. Place the Rise.ai gift custom block within the product template
On a drag & drop basis, we'd recommend placing the button's block above the standard Add-to-cart button:
โ
How to make the Rise.ai button visible only on the gift card product page
Add a unique tag to the Rise.ai gift card product on your Shopify admin
Within Tapcart, add the above tag as a 'Conditional Tag' to the Rise.ai button
โConsiderations:
The button's design and style is based on your Tapcart's theme design. It is not customizable through CSS (if the code is customized, Tapcart's theme design will still override it). Tapcart's theme design is located in 'App Studio' -> 'Brand Kit', within your Tapcart dashboard.
Have more questions?
Feel free to contact us at [email protected] or in the chatbox.