Dynamic Product Pages / CMS / Personalised Product Pages

Ask the community
, , , ,
1

Hi Everyone,

I am shifting my online store from BigCommerce to Wix. Here’s the issue I am facing:

I have 25 products and some products have a specific ‘story’ that we include in that product page for our customers to view and read through.

Now the issue is, out of the 25 products, only 15 have a story and 10 are just accessroeis that need the bare minimum information.

Now, the Wix Support team recommended to use CMS as the solution. We understandtly have different stories for each products. That got managed. However, the CMS template does not go away for the remainder of the 10 products. So they have this random story template that is not relevant for the product. There is no we (at least according to customer reps) to remove this story widget from these 10 products.

Why is it hard to create a customised page for a product? Can Wix implement a setting where they designate widget blocks as ‘global/dynamic’ and widget blogs that are ‘static/product page only’

A little frusturated with this issue. Any help would be appreciated.

2

Continuing the discussion from Displaying Collection Content on Wix Stores Product Page:

You will have to write a few lines of code to collapse the section if there is no description associated with that product in the CMS, or expand it if there IS a description available.

Here’s an example when using datasets:

import wixData from "wix-data";
import wixLocationFrontend from "wix-location-frontend";

let product;

$w.onReady(function () {
  initDataset();
});

wixLocationFrontend.onChange((location) => {
  let newPath = location.path;
  if (newPath?.[0] === "product-page") {
    initDataset();
  }
});

async function initDataset() {
   $w("#myDataset").onReady(() => {
    let itemObj = $w("#myDataset").getCurrentItem();
    if (itemObj) {
      $w("#descriptionSection").expand();
   } else {
      $w("#descriptionSection").collapse();
   }
  });
}

Here’s another example using wix-data:

import wixData from "wix-data";
import wixLocationFrontend from "wix-location-frontend";

let product;

$w.onReady(function () {
  initProductPage();
});

wixLocationFrontend.onChange((location) => {
  let newPath = location.path;
  if (newPath?.[0] === "product-page") {
    initProductPage();
  }
});

async function initProductPage() {
  product = await $w("#productPage1").getProduct();
  wixData
  .query("myCollection")
  .eq("reference", product._id)
  .find()
  .then((results) => {
    if (results.items.length > 0) {
     $w("#descriptionSection").expand();
    } else {
     $w("#descriptionSection").collapse();
    }
  })
  .catch((err) => {
    console.log(err);
  });
}

NOTE: Make sure to change the IDs of the datasets, collections, fields & sections for this code to work. Also ensure that your collection’s Read permissions are set to Everyone. More on that here.