Hi , I am trying to set up an "store" (really an art gallery show) so that viewers can click on a gallery image to go to a product page where they can see the artwork in fullscreen and also add to cart and buy online.
I used the store product page and created a dynamic page from there. On the new dynamic page I added a single image pro gallery so I could have both horizontal and vertical images fit without cropping. I was able to custom code a text button that would replace the any artwork prices as $0.00 to show Not for Sale instead and I was able to create a sold image for any artwork whose inventory gets changed to "out of stock" All that works fine and changes dynamically when I switch products.
I then added a "add to cart button" from the wix store but it will not change based on the dynamic page . I have to manually set it for a particular product. I thought I would just do that after trying many coding solutions but it only will remember the product I last linked the button too so I cannot seem to manually set each product either.
Is there a way to code the add to cart button to add the correct price to the cart based on the product that is selected ? I also tried creating a generic button and tried to link the data but there was nowhere to link to . I copied some code examples but they didnt work and I kept getting .addToCart is not a valid function or is not a part of $w element.
Here is my code:
// For full API documentation, including code examples, visit https://wix.to/94BuAAs $w.onReady(function () { // TODO: write your page related code here... $w("#dynamicDataset").onReady(() => { let items = $w("#dynamicDataset").getCurrentItem(); console.log (items["formattedPrice"]); if (items["formattedPrice"]=== "$0.00") { $w("#text7").show(); $w("#text6").hide() } else $w("#text7").hide(); }); $w("#dynamicDataset").onReady(() => { let stock = $w("#dynamicDataset").getCurrentItem(); if (stock["inStock"]=== false) { $w('#vectorImage1').show();} else $w('#vectorImage1').hide(); }); });
This code works although any suggestions welcome .I deleted the parts I tryed with the add to cart button as none of them worked and I was not sure where to add it.
Any help would be greatly appreciated !
Thank You
Hi everyone, I figure out the problem. I did not also add a shopping cart icon to the page . Once I did that , it all seems to work.
Still if anyone has any better suggestions on how to write this better then I would be happy to learn !
$w.onReady(function () { // TODO: write your page related code here... $w("#dynamicDataset").onReady(() => { let items = $w("#dynamicDataset").getCurrentItem(); console.log (items["formattedPrice"]); if (items["formattedPrice"]=== "$0.00") { $w("#text7").show(); $w("#text6").hide() } else $w("#text7").hide(); }); $w("#dynamicDataset").onReady(() => { let stock = $w("#dynamicDataset").getCurrentItem(); if (stock["inStock"]=== false) { $w('#vectorImage1').show();} else $w('#vectorImage1').hide(); }); }); export function button3_click(event) { // Add your code for this event here: export function addToCartBtn_click(event, $w) { const productId = $w('#dynamicDataset').getCurrentItem()._id; $w("#shoppingCartIcon1").addToCart(productId); }