CatalogProductListingCompatibility (optional)
https://github.com/magesuite/catalog-product-listing-compatibility
This module allows using MageSuite product carousel as a template for "Recently viewed products" and "Recently compared products" widgets. It aligns displaying products to the other parts of the shop, using MageSuite's carousel and product tile.
It allows you to add Magesuite’s Product Carousel, Product grid and Product teaser in Magento’s Product List Widget too.
Installation
This module is optional.
composer require "creativestyle/magesuite-catalog-product-listing-compatibility" ^1.0.0Admin settings
There are no admin settings.
Backend
There are no backend functionalities in the module.
Frontend
The module changes the path of Magento_Catalog/template/product/list/listing.html to the module's one MageSuite_CatalogProductListingCompatibility/template/product/list/listing.html.
It adds an additional condition to the html template to check if displayAsMagesuiteCarousel is set to true and if carouselMarkup is ready.
<!-- ko if: displayAsMagesuiteCarousel && carouselMarkup -->
<div data-bind="html: carouselMarkup"></div>
<!-- /ko -->
The default value of displayAsMagesuiteCarousel is in the mixin false, however, true value can be passed in a widget phtml template:
<?php /* @noEscape */ echo $block->renderApp([
'widget_columns' => [
'displayMode' => 'grid',
'displayAsMagesuiteCarousel' => true
],
'image' => [
'imageCode' => 'recently_viewed_products_grid_content_widget'
]
]);
The module provides a mixin to the product listing UI component, allowing usage of the carousel instead of the default view.
carouselMarkup is fetched from magesuiteCarouselRendererEndpoint ('/products_renderer/recommendation/carousel/') based on productIds array. The response from the server is expected to contain HTML markup for MageSuite carousel, which is passed to the carouselMarkup observable, and then mage.apply is called.