Who doesn’t like having a Shopify store with all the products in all variants and colors in stock, ready to be shipped to the clients? We all know this is just an ideal situation, especially when you sell many products that might come from different providers. 

When you develop your Shopify store, you might find yourself in a situation where you want to display something specific on a product page when a user chooses to view one of the product variants that are not in stock. If you are a developer and want to display some information from a variant that is not in stock, you probably know that when you look at the variant received from Shopify when it is unavailable, it comes as null... Really?!... So, we have no information about this variant that we can display? 

We can’t show a message with the information stored from the variant: image, color? We can’t change the product price so that the clients can know how much that product variant costs even if it is unavailable and they plan to buy it in the future.

This is a significant inconvenience. So, what do you do as a developer when a client really wants to provide such messages or price updates even if Shopify doesn’t give this information?

The probability of getting into a situation where some variants will be out of stock is high, but fortunately, you have a rope to hold on to. The trick you can do should happen between two moments: when you click a new variant button and when you call the function to open the latest variant. Here, you could set some attributes to relevant page elements or store just the most important one: the clicked variant ID. 

Once this is saved as an attribute on the page when the new variant is loaded, and it comes as null, you could do the second trick that finally solves the problem: use Shopify’s API that provides you the variant information starting from the variant ID you stored.

Don’t you like to break the limitations Shopify has? It really puts your mind to the test.