My wix store is selling knobs and pulls. They are separated in separate collections.
I am trying to create a related items area. When one of the knobs or pulls are selected and goes to the product page, I want the related items to be the other items from that particular collection (about 3 or 4 of them).
My site is not doing that. It looks like it’s showing related items based on price. I do not want that, I want same collection only.
Remember - I don’t want the similar items for pricing, i want similar items based on the product shown (so it’s shows the others in that particular collection).
Based on my comment above, I actually have my database working. It is a store for knobs and pulls (hardware). Each of my items have two in the collection. I have one item that has four and I can not get the repeater to show all four. It will show 2 or 3 but not four. Code is set to:
relatedProducts.splice(4, relatedProducts.length);
I believe this article will help you.
Its about, how to add a related products area to a wix store product page.
In the example at the article we define the related products in two ways:
Products that manually define as relating to the current product. By creating that relationship in a new collection.
Products whose price is 20% greater or 20% less than the current product.
Obviously, you can change the related products area’s definition according to your wish.
Thank you, I’ve looked at a lot of articles. That one your recommended is exactly the way I am setting it up. However, I don’t need the pricing comparison - (but I’ll deal with it). I want it based on items that are in the same collection.
Anyway, I got it pretty much figured out - however - if you look at my shop: https://www.yourhomecenter.net/shop - there is only 1 item that baffles me. The collection: Cordova has 4 items. I can not get them to show all the other 3 in the repeater. The handle shows 2 in the repeater. The second knob only shows 1 in the repeater. The 3rd knob shows only 1 in the repeater and the last knob on the next row shows 2 items.
I can not get that collection to show all 3 items in the repeater on any of the 4 in the collection.
How do I get the repeater to show the other 3 items in the collection when one is chosen?
I believe the problem is that you referenced product collections instead of products.
To fix the issue, make sure to select each product in the first product field, then add a reference to the related product in the second field.
As you can see in this example , at product A and product B fields only the product itself is referenced and not its collection.
I definitely referenced the “products” and not the “collection”. I just can’t figure out how to list the “cordova” collection to get the repeater to show the other 3 items in the collection. All other items work perfectly showing what they are supposed to.
I have just noticed that on my product page where I placed my repeater, I have lost the magnifier for my photos. Anyone know how to get that feature back?
All my products work - EXCEPT Cordova. (I’m not showing all of my products in this example). This product has four items in the collection. I can not get all four to show in my repeater. The westbury collection has two so I reversed the numbers in product b and they show correctly. I even have some that have 3 in the collection and just reversed the numbers in product b. So if product A shows 1-2-3 going down the row, in B I put 3-2-1 and they all show correctly. BUT for Cordova, I can’t get but only 2 to show. If you have any words of advice, please let me know.
Try to give your products unique names. You probably choose the same product four times instead of choosing four different items at your related products DB.
Since all the related products different from each other only by series number, you don’t have a need in a Related Products collection.
(The related products collection is necessary, if different products from different collections were related to each other)
You can create a related products array, that contains all the products that their collection names are equal to the current product’s collection name and then insert it data to the repeater.
Line 3: Insert to the variable productName only the collection name (for example: Cordova)
Here you can read more about the split() function.
-Line 6-9: Get from the collection “Products” all the products that include the collection name beside the
current one.
Here you can read more about contains() function.
Here you can read more about ne() function.
-Line 10: Return an array of items.
If you wish to stay with the Related Products collection, in order to present for each Cordova items all the other 3 Cordova items you have to add more connections in the collection.
At the current situation, only Cordova 4 and Cordova 2 will be presented as a related products to
Cordova 1, because you miss the connection between Cordova 1 and Cordova 3.
Add a new row so Cordova 1 will be at the Product A field and Cordova 3 will be at Product B field.
As a result from the first query you will get two items Cordova 4 and Cordova 3 and from the second one one item, Cordova 2.
async function relatedProductsByTable(product) {
let productId = product._id; // find related products by relation table
let relatedByTable = await Promise.all([ wixData.query('relatedProducts')
.eq('productA', productId)
.include('productB')
.find(),
wixData.query('relatedProducts')
.eq('productB', productId)
.include('productA')
.find() ]);
let relatedProducts = [
...relatedByTable[0].items.map(_ => _.productB), ...relatedByTable[1].items.map(_ => _.productA)
];
return relatedProducts;
}
Thank you this worked for me also. However, I have a problem still.
The related items are returned. However, if you click on one of them, the related items do not update, they remain the same. Its as though the code doesn’t re-run.
If you come out of the product page and then select the same product in the main products pag, it does update the related items correctly…
Any way of re-running the script when a related item is clicked within the product page?
