Adding Part Schematics to my store

I am creating a website for internal use at our tool company. I am using Easify to create custom product options, but I would like to be able to highlight the part numbers and have them clickable to be added to the cart, just like in the attached photo. Most automotive part websites have this functionality.

What is the best way/plugin to achieve this?

Hi @GRS24 ,

I don’t know of an exact app that can allow this but you are welcome to browse the Shopify App Store to see what’s there; I think you may have to look into hiring a Shopify Expert for something like this as this would likely require custom code changes.

What you’re trying to build is usually done using interactive product diagrams with clickable hotspots placed over an image.

Each hotspot is then linked to a specific Shopify product or variant, so customers can visually select the exact part they need and add it directly to cart. This is a common pattern on automotive and replacement parts websites.

There are a couple of ways to approach it:

  • Some merchants build it custom using theme code and metafields

  • Others use apps that are designed specifically for hotspot-based product diagrams and parts selection workflows

Full disclosure, I’ve built a Shopify app called Konfigr that focuses on this exact use case (turning parts diagrams into interactive, clickable product layouts inside Shopify).

Hopefully that helps point you in the right direction.

Nailed it, love this layout but shopify out of the box won’t do this. Easify won’t help either bc that’s just for variant options on a single product page.
What you’re looking for is called “image hotspot” or “interactive lookbook” functionality. You can search the app store for image hotspot apps that support ajax add to cart.