Product Card Interface

introduction the product card interface lets you display b2b pricing and the ability to add products to an order anywhere a "product card" is shown on your website typically this includes product collection (or "category") pages, and product upsells sparklayer interactive demo you can explore how the sparklayer product page interfaces work in our interactive demo how it works the product card interface replaces your existing website's product card pricing and "add to cart" area with a specially optimised layout once set up, it provides b2b customers an easy way to see their pricing and begin adding products to their order the interface can show the following information item details product pricing their specific b2b pricing and, optionally, rrp pricing variants a drop down list of available variants quantity the ability to select the quantity of a product using quantity rules docid\ cmxfrpgjqxfz9vjztvv0d add to order the ability to add items to an order quantity pricing visibility of quantity pricing available stock level the stock status of a product (e g pre order) sku the product code (sku) integrating the code to add the product card interface to your website, you just need to add a single line of code to the product cards that display on your collection pages \<spark product card parent id="{{ product id }}">\</spark product card> once 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 bigcommerce docid\ x6xahbj 9kyjthd80 1qh 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!