Product Detail Interface
The Product Detail Interface lets your B2B customers quickly and easily add products to their order and automatically loads when a logged in B2B customer visits a product detail page on your website.
SparkLayer Interactive Demo You can explore how the SparkLayer Product Page Interfaces work in our interactive demo.
The Product Detail Interface replaces your existing website's pricing and "add to cart" area with a specially-optimised layout. It supports a variety of product types, from single variant products, to multi-dimensional products (e.g. colour and size). When a B2B customer visits a product detail page, they'll see this specially-optimised layout and can begin ordering.
This is the most simple product type with just a single option to purchase.
What SparkLayer displays
- Product price specific to the customer (including quantity pricing)
- RRP Price (if set)
- Product SKU (or code)
- Stock availability (including pre-ordering)
- Quantity, including quantity rules (e.g. pack-sizes)
- Add to Order button
To add the Product Detail Interface to your website, you just need to add a single line of code to your product detail page template.
One this is added, the interface will display for all logged in B2B customers and they can begin placing orders.
Please note Based on the platform you're using, the variable product.id will need to be adjusted to the appropriate setting. If you're installing on your Shopify website, please see our guide here
Important! If you're using SparkLayer on your existing website, you will need to hide elements that you don't want your B2B customers to see. Please see our full guide here.
SparkLayer supports a wide range of configurations you can apply to the Frontend Interfaces. Please see our full guide here on what's possible!