Integrating Spreadr App
Prathamesh Pramod Gaonkar
Last Update 2 天前
This guide will walk you through the simple process of integrating the Spreadr App into your Shopify site.
On the product pages, you have 2 options:
1. Replace the Add to Cart button with the Spreadr button
2. Add the Spreadr button along with the Add to Cart button
If you are unsure you may simply contact us at [email protected]. We will assist you in the integration.
1. Replace the Add to Cart button with the Spreadr button
Steps
1. Open your Shopify admin.
2. Click Online Store.
3. Click Themes.
4. Click Actions for your published theme.
7. The product-template.liquid file will open in the online code editor. In the online code editor window, locate the HTML for your add-to-cart button (you can do this by searching with CTRL-f or COMMAND-f). The HTML for your add-to-cart button will look something like this:
The actual code may appear slightly different between themes. The trick is to find an <input> or <button> tag that includes something like 'Add to Cart', 'AddToCart', or 'add-to-cart' etc.
NOTE: If the above code is not found in the product-template.liquid file, it could be found in any one of the following files (it is theme-dependent):
- Templates/product.liquid
- Snippets / product-form.liquid
- Sections/product.liquid
- Snippets/product-options.liquid
(If you are having problems please contact [email protected]. We will do the integration for you.)
8. On the very next line, add the following code.
2. Add the Spreadr button along with the Add to Cart button
Go to sections/product-template.liquid file.
Add the below code to display the Spreadr button along with the add to cart button for Spreadr products.
The code will look as -
This will add the Speadr button with the existing Add to Cart button.
Note: The code may vary from theme to theme.
Preview:
Similarly, the Spreadr button code can be placed for the Featured Product Card on the Home page, and also on the product grid on the Search page.