J'ai créé un code mais le curseur n'apparaît pas dans les produits récemment consultés.
Voici mon code -
J'ai téléchargé slick js et css à partir du lien suivant http://kenwheeler.github.io/slick/
Ensuite, j'ai fait ce qui suit -
Étape 1 -
Slick.min.js et slick.js copiés dans
app / design / frontend / _YOUR_VENDOR _ / _ YOUR_THEME_ / web / js /
Étape 2 -
Créez le fichier requirejs-config.js dans
app / design / frontend / _YOUR_VENDOR _ / _ YOUR_THEME_ / web /
avec le code suivant dans requirejs-config.js
var config = {
paths: {
slick: 'js/slick'
},
shim: {
slick: {
deps: ['jquery']
}
}
};Étape 3 -
Copié slick.less et slick-theme.less dans
app / design / frontend / _YOUR_VENDOR _ / _ YOUR_THEME_ / web / css / source /
Étape 4 -
Vider le cache et déployer des fichiers
Étape 5 -
Créé view_grid.phtml dans
app / design / frontend / _YOUR_VENDOR_ / YOUR_THEME / Magento_Reports / view / frontend / templates / widget / seen / content
avec le code suivant -
<?php
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
// @codingStandardsIgnoreFile
?>
<?php
/**
* @var $block \Magento\Reports\Block\Product\Viewed
*/
?>
<?php
if ($exist = ($block->getRecentlyViewedProducts() && $block->getRecentlyViewedProducts()->getSize())) {
$type = 'widget-viewed';
$mode = 'grid';
$type = $type . '-' . $mode;
$image = 'recently_viewed_products_grid_content_widget';
$title = __('Recently Viewed');
$items = $block->getRecentlyViewedProducts();
$showWishlist = true;
$showCompare = true;
$showCart = true;
$rating = 'short';
$description = ($mode == 'list') ? true : false;
}
?>
<?php if ($exist):?>
<div class="block widget block-viewed-products-<?= /* @escapeNotVerified */ $mode ?>">
<div class="block-title">
<strong role="heading" aria-level="2"><?= /* @escapeNotVerified */ $title ?></strong>
</div>
<div class="block-content">
<?= /* @escapeNotVerified */ '<!-- ' . $image . '-->' ?>
<div class="products-<?= /* @escapeNotVerified */ $mode ?> <?= /* @escapeNotVerified */ $mode ?>">
<ol class="product-items <?= /* @escapeNotVerified */ $type ?>">
<?php $iterator = 1; ?>
<?php foreach ($items as $_item): ?>
<?= /* @escapeNotVerified */ ($iterator++ == 1) ? '<li class="product-item">' : '</li><li class="product-item">' ?>
<div class="product-item-info">
<a href="<?= /* @escapeNotVerified */ $block->getProductUrl($_item) ?>" class="product-item-photo">
<?= $block->getImage($_item, $image)->toHtml() ?>
</a>
<div class="product-item-details">
<strong class="product-item-name">
<a title="<?= $block->escapeHtml($_item->getName()) ?>"
href="<?= /* @escapeNotVerified */ $block->getProductUrl($_item) ?>" class="product-item-link">
<?= $block->escapeHtml($_item->getName()) ?>
</a>
</strong>
<?php /* @escapeNotVerified */ echo $block->getProductPriceHtml(
$_item,
\Magento\Catalog\Pricing\Price\FinalPrice::PRICE_CODE,
\Magento\Framework\Pricing\Render::ZONE_ITEM_LIST,
[
'price_id_suffix' => '-' . $type
]
) ?>
<?php if ($rating): ?>
<?= $block->getReviewsSummaryHtml($_item, $rating) ?>
<?php endif; ?>
<?php if ($showWishlist || $showCompare || $showCart): ?>
<div class="product-item-actions">
<?php if ($showCart): ?>
<div class="actions-primary">
<?php if ($_item->isSaleable()): ?>
<?php if ($_item->getTypeInstance()->hasRequiredOptions($_item)): ?>
<button class="action tocart primary"
data-mage-init='{"redirectUrl": {"url": "<?= /* @escapeNotVerified */ $block->getAddToCartUrl($_item) ?>"}}'
type="button" title="<?= /* @escapeNotVerified */ __('Add to Cart') ?>">
<span><?= /* @escapeNotVerified */ __('Add to Cart') ?></span>
</button>
<?php else: ?>
<?php
$postDataHelper = $this->helper('Magento\Framework\Data\Helper\PostHelper');
$postData = $postDataHelper->getPostData($block->getAddToCartUrl($_item), ['product' => $_item->getEntityId()])
?>
<button class="action tocart primary"
data-post='<?= /* @escapeNotVerified */ $postData ?>'
type="button" title="<?= /* @escapeNotVerified */ __('Add to Cart') ?>">
<span><?= /* @escapeNotVerified */ __('Add to Cart') ?></span>
</button>
<?php endif; ?>
<?php else: ?>
<?php if ($_item->getIsSalable()): ?>
<div class="stock available"><span><?= /* @escapeNotVerified */ __('In stock') ?></span></div>
<?php else: ?>
<div class="stock unavailable"><span><?= /* @escapeNotVerified */ __('Out of stock') ?></span></div>
<?php endif; ?>
<?php endif; ?>
</div>
<?php endif; ?>
<?php if ($showWishlist || $showCompare): ?>
<div class="actions-secondary" data-role="add-to-links">
<?php if ($this->helper('Magento\Wishlist\Helper\Data')->isAllow() && $showWishlist): ?>
<a href="#"
class="action towishlist" data-action="add-to-wishlist"
data-post='<?= /* @escapeNotVerified */ $block->getAddToWishlistParams($_item) ?>'
title="<?= /* @escapeNotVerified */ __('Add to Wish List') ?>">
<span><?= /* @escapeNotVerified */ __('Add to Wish List') ?></span>
</a>
<?php endif; ?>
<?php if ($block->getAddToCompareUrl() && $showCompare): ?>
<?php $compareHelper = $this->helper('Magento\Catalog\Helper\Product\Compare');?>
<a href="#" class="action tocompare"
data-post='<?= /* @escapeNotVerified */ $compareHelper->getPostDataParams($_item) ?>'
title="<?= /* @escapeNotVerified */ __('Add to Compare') ?>">
<span><?= /* @escapeNotVerified */ __('Add to Compare') ?></span>
</a>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
</div>
<?= ($iterator == count($items)+1) ? '</li>' : '' ?>
<?php endforeach ?>
</ol>
</div>
<?= $block->getPagerHtml() ?>
</div>
</div>
<script>
require([
'jquery',
'slick'
], function ($) {
jQuery(document).ready(function () {
jQuery(".widget-viewed").slick({
dots: true,
infinite: true,
speed: 300,
slidesToShow: 4,
slidesToScroll: 4,
responsive: [
{
breakpoint: 1280,
settings: {
slidesToShow: 3,
slidesToScroll: 3
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
},
{
breakpoint: 600,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
}
]
});
});
});
</script>
<?php endif;?>Étape 6 -
Vider le cache et déployer à nouveau les fichiers
Mais le curseur n'apparaît toujours pas pour les produits récemment consultés en frontend
S'il vous plaît, aidez-moi à corriger le code ou à créer un module pour afficher le produit récemment consulté avec slick slider :)
Avez-vous déjà compris cela? J'essaie actuellement la même chose. D'après ce que je peux dire, je pense que le widget se charge après l'exécution de mon javascript. J'ai essayé d'envelopper mon code dans un écouteur de changement de document mais cela ne semble pas aider non plus.
—
Jim
J'essaie également d'appliquer un slick slider dans mon magento. J'ai fait référence à de nombreux documents, ils sont tous placés slider slider dans le thème. J'essaie de le placer dans mon module personnalisé. Vous en avez une idée?
—
Siranjeevi KS