Shopify Online store 2.0 Themes - Block Support
Shopify Online store 2.0 theme doesn’t require code placement for the Wishlist button on the product page. The button can easily be enabled and placed right from the theme customization section.
Check out the steps below to understand how Shopify Online Store 2.0 theme works with the app:
Advanced Wishlist Widget Placement
- Navigate to the Online Store section of your Shopify store and under the Themes page
and look for your preferred Shopify 2.0 theme that is compatible and click Customize.
The store preview would appear.
2. On the Theme Customization page, click on ThemeSettings in the bottom left corner.
This enables you to customize the Shopify theme.
3. Click on App embeds tab on the right side of the page under the Theme settings block and enable the Advanced Wishlist app and Save settings.
4. Using your store’s navigation, visit any individual product page (PDP). On Theme Editor select Products - Default product from the dropdown list.
5. In the left sidebar, under Product Information, scroll down to the bottom and click Add Block. Select Wishlist Button.
6. Preview the Shopify storefront by selecting the View button from the Action menu in the top panel and the find Wishlist button added to the product page.
The following steps involve adding a few lines of code or snippet additions manually. If you're not comfortable working with codes, we insist you contact us at help@hulk-support.com.
Basic App Setup
7. Adding Wishlist button on the collection page
If you want to add the Wishlist button to the collection page, you need to add the below code to the file card-product.liquid:
<div style=“text-align: end;“>{% render 'hulkapps-wishlist-collection-btn', productId: product.id, variantId: product.selected_or_first_available_variant.id %}</div>
8. Adding the "Save for Later" button
For adding "Save for Later" button to the cart page you need to embed code in the main-cart-items.liquid file:
{% render 'hulkapps-wishlist-cart-btn', productld: product.id, variantld: product.selected_or_first_available_variant.id, looplndex: looplndex%}
9. When you are satisfied with the placement of the Wishlist button, click the Save button at the top right. If you wish to update the Add to Wishlist text, you may find the setting in the App's admin panel.
Open Apps => Advanced Wishlist => Settings => Language Settings
All Other settings
Please update your preferences in the app’s admin panel, except for the button customization.
IMPORTANT NOTE: Currently, only button customization is possible in Shopify's theme editor. Anything that is changed in the admin panel for buttons will not be visible on the storefront.
Once you've configured your button via Online Store =>Customize, you do not have to update the button customization settings in the app’s admin panel again. This section is only applicable for Online Store 1.0 users.