Medusa admin UI modul with category thumbnail support, using metadata for store the information about thumbnail.

Medusa Website | Medusa Repository

• Product category thumbnail
• Easy UI management of all product categories

• Medusa backend

1. Run the following command in the directory of the Medusa backend:

yarn add medusa-plugin-categories

2. In medusa-config.js add the following configuration at the end of the plugins array:

const plugins = [
  // ...
  {
    resolve: `medusa-plugin-categories`,
    options: {
      enableUI: true,
    },
  },
];

Run the following command in the directory of the Medusa backend to run the backend:

yarn dev

In StoreFront project you can use the thumbnail by

category.metadata?.thumbnailImageUrl

Example:

import { getCategoriesList } from "@lib/data"

const { product_categories } = await getCategoriesList()

const thumbnails = productCategories.map((category) => (
    <img
      src={decodeURI((category.metadata?.thumbnailImageUrl as string) || "")}
      alt={category.name}
    />
  ))

• Product categories with thumbnail