Product Detail Interface

introduction 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 how it works 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 this interface will render for products that have variants (e g colour, size, etc) to make purchasing easy, the variants are displayed in a table format what sparklayer displays product price specific to the customer (including quantity pricing) rrp price (if set) variant list primary variant (e g colour) and secondary variants that relate to them (e g size) pack sizes (if available variant specific price and rrp price stock availability if a variant isn't available, it will display accordingly note unless the set up allows purchase of out of stock products, the product will display as unavailable if there is no stock quantity, including quantity rules (e g pack sizes) add to order button integrating the code 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 \<spark pdp parent id="{{ product id }}">\</spark pdp> 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 installing sparklayer on shopify docid 687zisnq7rsitcgjjkfyb 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 frontend integration guide docid\ qwxsym9x5 pviogutekcp configurations sparklayer supports a wide range of configurations you can apply to the frontend interfaces docid\ ccz1vnh0o6d 722w35xpa please see our product display docid\ m3df4f0eyc2rm vuarg9h on what's possible!