There are two ways to integrate the app into the theme, depending on the theme version (Online Store 1.0 or 2.0)
Shopify Online Store 1.0
Please ensure to integrate the theme with your store's duplicate/staging theme to avoid conflicts.
Follow the steps for theme integration:
With Online Store 1.0 Theme Integration, it is necessary to manually add the snippets in the theme files to display the Trust and/or Payment Badges in the Shopify storefront.
The location of the badges is a subjective choice, and choices differ in deciding the ideal location to place the badges in the store. Hence, we have enabled our app users to set the codes in the theme files on their preferred location.
Adding the Trust Badges
1. Access the Shopify store admin and navigate to Themes > Choose the theme > Actions > Edit Code
2. In this example, we are adding the Payment Badges below the Add to Cart button on the Product Page of the Shopify Store.
3. Copy the code <div class='hulkapps-trust-icons'> </div> (this code can also be found at the bottom of the Trust Badges configuration page.)
4. Find the code of the Add to Cart button in the store’s theme template and place this snippet just below the Add to cart Button code. And save the template.
5. Check the product page and you’ll find the badges displayed below the Add To Cart button.
The guidelines mentioned above also apply to the Payment Badges placement.
Shopify Online Store 2.0
Online Store 2.0 theme doesn’t require any code placement. The badges can easily be enabled and placed right from the theme customization in the Shopify Dawn theme.
Check out the steps below to understand how Shopify Online Store 2.0 theme works with the app:
1. On the Dashboard, click on the Theme integration --> Enable app.
2. Click on the App embeds tab on the right side of the page under the Theme settings block and enable the Add Badges and Icons option and Save the settings.
4. Now, click on the Add section option on the left side of any customization page. And select the Payment Icons/Trust Badges option and Save the template.
5. Preview the Shopify storefront by selecting the View button from the Action menu available in the top menu and find the badges on the page it's added to.
NOTE: You can drag and drop the section to adjust the position of the badges as per your preference.