The following post covers off how to add better compare at to merchants on Shopify Plus.
At it's core, there are three core parts that make up better compare at pricing, these are:
Metafield for Sale Price
We store the desired sale price for each product variant in a dedicated metafield. This metafield is updated automatically via a simple Gadget app. Although Shopify Flow is an option, our need for function activations on install led us to use an app for greater control and consistency.
Cart Transform: UpdateOperationFixedPricePerUnitAdjustment
When a customer adds an item to the cart, we use a cart transform operation to update the variant’s price back to its compare-at value. This operation ensures that the full price is visible on the cart, setting the stage for a subsequent discount that effectively reflects the sale price.
Discount Function: DiscountApplicationStrategy.ALL
Finally, we apply a discount function that calculates a per-unit discount equal to the difference between the compare-at price and the sale price stored in the metafield. This discount is implemented as a combinable discount (using the ALL strategy), which means merchants can control how it stacks with other promotions or discounts based on their combine rules.
How the Code Ties It All Together
Below is a walkthrough of the main components in our implementation:
Cart Transformation
Before applying the discount, we update the cart’s line items cost. The cart transform operation uses UpdateOperationFixedPricePerUnitAdjustment to adjust the price back up to the compare-at price. For each cart line that meets our criteria we verify if the compare-at price is higher than the sale price. If it is, we adjust the cart line’s price.
Applying the Discount
Next, we calculate the discount to be applied. By comparing the original price to the sale price (retrieved from our metafield), we compute the difference and derive a percentage discount:
Shopify Markets & UpdateOperationFixedPricePerUnitAdjustment
Since an UpdateOperationFixedPricePerUnitAdjustment works relative to the buyer’s currency (not the store’s currency), here are a few strategies to consider:
Maintain a Price Sheet:
Keep a price sheet that holds the relevant compare at prices for different currencies.Early Exit on Currency Mismatch:
Simply return early in both functions if presentmentCurrencyRate != 1.Adjust Using presentmentCurrencyRate:
You could use presentmentCurrencyRate to calculate the correct value. Fair warning, this might lead to mismatches between the value your function returns and what’s actually shown on the storefront.Signed Line Item Attributes:
Pass the compare_at price as a signed line item attribute (using something like Liquid’s hmac_sha256). Then, in a Rust function (since JS isn’t ideal for crypto work), verify that the value is within an acceptable variance when compared to a value derived from presentmentCurrencyRate. If the product still has an active compare at price, proceed with the transform and discount.
Side note: If you haven’t played around with signed line item attributes yet, now’s a great time to experiment—it’s a cool introduction to using Rust functions and opens up some neat possibilities on the storefront.
Why Do We Need a Metafield?
When you apply an UpdateOperationFixedPricePerUnitAdjustment, it pins both the price and the compare at price to the values specified in the update operation. This means you lose access to the original price (which is needed if you ever need to re-calculate or “discount back” to it). Storing the original price in a Metafield ensures you can always reference it later for any future operations
Other gotchas
Interaction with Other Functions & Standard Discounts:
When deploying on a storefront, be mindful of how this function interacts with other functions and standard discounts. Remember, apps might use functions for non-obvious purposes. For instance, if you’re also using UpdateOperationFixedPricePerUnitAdjustment for product add ons (like warranties), make sure to thoroughly test against those cases.
Thorough Testing is Essential:
Test, test, test! The behavior of these functions can have a direct monetary impact. This isn’t something to roll out just before a big sale—the deployment needs to be carefully planned and closely monitored in a live environment.