Wishlist with Add to Cart Button

Wishlist with Add to Cart Button

Log in or Sign up to ensure access to purchased code across multiple devices.

How to see the code

1. Please log in/create an account first. This is to ensure that all purchases are connected to an account and can be viewed on different devices.

2. Purchase the code using the "purchase box" on the specific page of the desired code.

3. After the purchase, please refresh the page.

Compatibility: All  Shopify 2.0 FREE themes  ONLYWorks from lower version to version 11

Are you losing customers because they forgot what product they want? Or even forgot which website they saw the product? Look no further. Our wishlist code is not only allow your customers to add the product in their wishlist but also can add the product to cart. Not only that, they have an option to share their list using the Share API with javascript. Correct, we are using javascript on this code and they will have no to minimal affect to your website's speed. 

We make the code not complicated for you to follow.

You can check the demo store here. Password: made4uo

What you are buying:

  • Add a product in the wishlist
  • May add the product to cart from wishlist
  • Can share the wishlist to someone
  • Customer's wishlist will not be available to admin page
  • Will not work with other Shopify apps
  • For newer version of Dawn theme, wishlist works with different type of header

What makes our code better:

  • We do not use external libraries, with that being said, our code will have no to minimal effect to your website's speed performance
  • We do not leave or add codes use to advertise for our website
  • Our code is mobile friendly

Any issues related to the code will be fix with no additional cost, excluding code customization requests. Simply contact us with "Chat with us." We are just a button away. 

To start:

1. Go to Admin Shopify store > Themes > Actions > Edit Code.

2. Open the Section folder, and create a new section, name it "wishlist".

3. Replace the default code with the code below. Make sure to SAVE.


4. Go to Asset folder, and open global.js file. 



5. Place the code below at the bottom of the file and SAVE. 


If you have Dawn version 8 and higher, please follow the instructions below.

6. Open your theme editor, and under your header group, before the work Template, click the "Add section", and look for "Wishlist". Then click to add. Make sure to save. You are not done. 

See image below for reference:

Wishlist section



If you have Dawn version 7 and below. please follow the instructions below.

6. Go to the Layout folder, and open the theme.liquid. 

7. Look for code  {% section 'header' %}. Add a next line, and paste the code below. Then click SAVE. You are now done.


See image for code placement



That's it (",) 


Back to blog

Leave a comment