How to build a Wishlist feature for Users on Shopify

Source

Wishlist is a powerful feature on any e-commerce store, it allows users to save the items they like or wish to buy in the future resulting in increasing engagement and potentially boosting sales.

Shopify does not have a built-in Wishlist feature.

There are two ways to implement any custom features on Shopify Store

  1. Using apps from the Shopify App Store
  2. Create a custom app in Shopify

Here in this blog, we will be addressing specifically implementing the Wishlist feature.

Using apps from the Shopify App Store

There are a variety of apps available in the Shopify App Store to implement the Wishlist feature like

Wishlist Plus, Wishlist — Wishify, Growave, and many more

Benefits

  1. Easy to install and use (no coding required)
  2. Often offer additional features beyond basic Wishlist functionality

Drawbacks

  1. Monthly app fees (expensive)
  2. Limited Customization Options
  3. Reliance on a third-party app

Create a custom app in Shopify (Requires Coding)

By developing a custom app in Shopify gives you full control of the functionality and customization.

You have two options for storing custom data:

  1. Shopify’s Metafields/ Metaobjects: This built-in tool lets you store custom data directly within Shopify itself.
  2. External Database: If you prefer, you can store this data in a separate database outside of Shopify.

This guide will focus on using Metafields, but the overall process is similar to an external database. The main difference is how you retrieve and manage the wishlist information — with an external database instead of Shopify Metafield

Create a Metafield

  1. Open to your Shopify Admin Dashboard
  2. Go to settings -> Custom Data -> Customer in Metafield Definitions
  3. Add a metafield definition
    • Name: Wishlisted Products
    • Type: JSON
  4. Click on save.

Developing an App

  1. Open to your Shopify Admin Dashboard
  2. Go to settings -> App and Sales Channels
  3. Click on “Develop Apps” -> “Create an app
  4. Type in a suitable name for your App
  5. In Admin API Integrations, add the required scopes: “write_customers” and “read_customers”.
  6. Install the app to your Shopify Store and Save all the API credentials (API key, API secret key, and Access-Token)

Building the Wishlist Functionality:

  1. Choose Your Coding Language: Select a language supported by Shopify’s Admin API (like Ruby, Python, or Node.js).
  2. Write the API: This API will interact with Shopify using the Admin API (REST or GraphQL) with your Access Token. Here’s a breakdown of the functionalities:
  • Fetching Customer Metafields: Make an API call like this with the Secret Key in the headers (replace placeholders with your data):
https://${storeUrl}/admin/api/${api-version}/customers/${customerId}/metafields/${WishListedProductMetafieldID}.json

This retrieves the “Wishlisted Products” metafield for a specific customer.

  • Updating Wishlist: Develop functionalities to add, remove, or manage wishlist products within the “Wishlisted Products” metafield using the Shopify Admin API.
  • REST Admin API reference (shopify.dev)

Deployment and Integration:

  1. Host Your API: For smaller stores, consider serverless cloud solutions like AWS API Gateway and Lambda Functions for cost-effective hosting.
  2. Integrate with Storefront: The final step is integrating your API with your store’s frontend. This will involve adding wishlist buttons, displaying the wishlist content, and interacting with the API to manage the wishlist data.

Conclusion

Choosing the right approach depends on your technical expertise and budget. If you’re comfortable with coding, a custom app using Shopify’s Metafields offers complete control and budget budget-friendly. However, for a quicker and easier solution, a wishlist app might be the best choice.

Back to blog