Good morning everyone.
I’m implementing a new ecommerce layout (VTEX IO) based on the Store Theme. We created a product list on the homepage using the native Shelf from the blocks, which comes essentially as a ready-made component since the layout we created isn’t very different from the existing shelf.
Our client asked for product prices to be displayed as PIX prices, i.e., with a 10% discount.
When I check the admin panel, PIX is set up as a cart discount under the Promotions tab, applying 10% to the PIX payment method — but when rendering the shelf on the front end, I don’t have the option to retrieve the product price and apply that 10%.
What would be the best way to display product prices with the PIX discount without breaking or straying too far from the VTEX blocks structure? (Our idea was to keep things as integrated with the Site Builder as possible.)
Thanks in advance to everyone who helps.
Hello @Trackdev,
I believe that to accomplish what you want, you’ll need to use the product-spot-price block (from the Product Price component) and also configure an orderForm field, specifically the paymentSystemToCheckFirstInstallment field, following the steps below:
1- Get the current orderForm settings using the Get orderForm configuration API.
2- Submit the content obtained in step 1 using the Update orderForm configuration API, changing the value of the paymentSystemToCheckFirstInstallment field from null to the ID of the store’s PIX Payment Condition.
3- Add the product-spot-price block to the store’s shelf.
The result might take some time to appear, since it depends on search indexing, but this should make the PIX discount show up on the shelf.
I’m also including below our documentation on Product Price and on orderForm updates, which has more details about each of these steps:
Product Price
Update an account’s orderForm Configuration
Eduardo Luciano
Field Software Engineer | VTEX