Recommendations
Rendering recommendations in a slider
To render recommendations in a slider, do the following:
- Fetch recommendations, see: this excerpt of the API integration guide.
- Render the recommendations using the
RecommendationSlider
function.
import {
RecommendationSlider,
onExistsObserver,
fetchDepictRecommendations,
} from "@depict-ai/js-ui";
const recommendations = fetchDepictRecommendations({
merchant: "MERCHANT_ID",
market: "MARKET", // See demo.depict.ai for available markets
locale: "en_GB", // See demo.depict.ai for available locales
type: "TYPE",
// click the link above for more information on the options here
});
const recommendationSlider = RecommendationSlider({
recommendations,
productCard, // The productCard component you created in a previous step
});
onExistsObserver("#frontpage-recommendations", (element) =>
element.append(recommendationSlider)
);
Looking for the reference?
Was this page helpful?