Hidden Add-On Products?

We’re making a public app which, for the purposes of simplifying this question, offers 3rd party warranty options for the items that a merchant sells. So a customer finds an item they want, let’s say a bicycle, and we add a little menu to offer a bronze/silver/gold plans, and if the user decides to select one then both the bicycle and the warranty are added to the cart. Simple, except how?

We don’t want users to see the warranty as a standalone product when browsing or searching the merchants store. Users certainly should not be able to buy one in isolation. This is an add-on to other products and not a product in itself. The tiers and pricing are also defined and managed by a 3rd party so the merchant should not be able to edit this.

So what can we do?

  • Our app can create a warranty “product” with variants for each tier and pricing option, but as far as we can tell there is no way to hide this from users while still keeping it purchasable.
  • We can dynamically generate a unique new warranty “product” for each checkout session, but it seems like we’d be polluting the merchants store with thousands of warranty products that users could see. Even worse.
  • We could add a line item directly to the cart, something that isn’t tied to a product at all, but this doesn’t seem possible.
  • We might be able to use collections to control visibility but this seems very fragile and unreliable since different merchants could use any number of different ways of organizing or using collections and they could have any number of other apps which interfere or modify this behavior.
  • We could change the price of the item but that doesn’t seem possible.
  • We could add a fee or surcharge but this doesn’t seem to exist and discounts can only reduce the price.
  • Something else?

It seems like there is no way to do this. Or am I missing something? The best we can come up with is to use a visible product and then modify the cart, admin functionality, and store functionality to try to hide, redirect, disable, or otherwise prevent people from doing things they shouldn’t do. At best this will be clunky and at worst unreliable or buggy. This is a really bad experience for both the user and the merchant. Is there really no way to achieve such functionality in Shopify?

Best I have seen is to edit the Theme to have a non-purchasble product
template, which gets assigned to these product to ensure that they cannot
be ordered, as well as the criteria for the theme.liquid to hide it from
search bots like google etc. Their collections must ignore the product via
name or tag etc so as not to have it displayed.
At this time on 2.0 I do not believe that there is a way to hide it from
search

Various client merchants already have their own themes. I’m not sure how much we can rely upon changing that :disappointed_face:

There’s also the draft-order sleight of hand, grab the cart, add a custom line item, send the customer to the draft orders checkout. :bomb: Keeping in mind this could mess up reporting as well.

Also look at post-checkout upsells as this is the type of service you should be bookending.

Generating products is the simplest yes but do pollute and can make data-reports a major hassle for a business to deal with. It can also be the slowest to make two calls creating a product then updating a variant; so you may want to pre-allocate empty products for speed-perf.

You may want to look over the locksmith app as that’s one of the most complex content gate-ing apps and understanding what it’s doing, more importantly what it cannot do is useful&painful knowledge for apps like yours.

For product description pages(PDP) You apply your own template , it can even use {% layout none %} so it’s basically a blank page if you want. Keeping in mind this template has to be generated when a theme is added to a store, or when it’s published to live, or preferably the merchant is prompeted to initiate so they know theme is being changed.

For non PDP’s use javascript/css with heuristics to hide the product and or disable add to cart buttons. This impacts pagination i’ve yet to see an app bother to fill the empty space in themes with row grids.

For cart/cart-drawers you also need to hide/prevent quantity and remove buttons/changes, along with automatic remove for invalid carts. See shopify’s gift-wrap customization doc for intro logic.

The theme integration considerations are annoying but the real problems are the SEO, ajax api , and backend validation that has to happen post-checkout, unless the store is PLUS and you are taking on the very large risk of modifying checkout.liquid as an app or guiding merchants to do it.

Seo - It’s easy for merchants to add links to your addon that then get followed. There is a SEO metafield you can add hide them from crawlers though forums make it seem spotty, and then there’s modifying the robots.txt file itself which is a risk factor.

Ajax api - makes any published product programmatically accessible regardless of liquid rendering. Though for a warranty use-case I don’t think that’s a business concern but who knows what legal requirements you have.

Backend validation, most “addon” apps passively create situations where the addon-product is erroneously added to a cart/checkout/order increasing cost but isn’t actually meant to be in the order. Such as when a checkout items stock changes before completion and a customer gets the prompt to remove an item during the checkout process leaving a dangling addon-product behind.

It’s annoying we can’t just create negative discounts as a workaround to fake fees, it’s one of those weird areas in shopify where there’s no “workaround” that simplifies things once you know it.

In a better future this would start to be better if the discount system ever gets a way to auto-inject&auto-validate products into the cart to facilitate the buyXgetY use cases.

Bleh

In addition to the excellent advice already given, I’d recommend having a look at the Selling Plan API + Subscription Product App extension combo. Might be an option for you.

1 Like