eRjejeRjej MitgliedKommentare: 1 Danke erhalten: 0 Mitglied seit: Dezember 2015 bearbeitet Dezember 2015

i have problem with my slider when i used in my plugin. I wont to set how many items show at starts in slider. eg get 15 articles, and i would like to show 4 articles per page.

My plugin code (in emotion component template):
<div class="product-slider product-slider--content" data-product-slider="true" data-itemsPerPage="4">
  <div class="product-slider--container is--horizontal">
    {foreach from=$groupArticles item=sArticle}
      {include file="frontend/listing/box_article.tpl" sArticle=$sArticle productBoxLayout="slider" sCategoryCurrent=$sArticle.categoryID}
But data-itemsPerPage="4" nothing do, always run js function setSizes() in \themes\Frontend\Responsive\frontend\_public\src\js\jquery.product-slider.js

How to sets manualy items per page with different shopping words?


  • mowlwurfmowlwurf MitgliedKommentare: 33 Danke erhalten: 9 bearbeitet April 2017 Mitglied seit: April 2017

    I ran into the same problem, data-itemsPerPage has no impact on the slider, the itemsPerPage only get calculated internaly by jquery.product-slider.js::L503

    setSizes: function (orientation) {
                var me = this,
                    o = orientation || me.opts.orientation,
                    containerSize = (o === 'vertical') ? me.$el.innerHeight() : me.$el.innerWidth(),
                    itemSize = (o === 'vertical') ? me.opts.itemMinHeight : me.opts.itemMinWidth;
                me.itemsPerPage = Math.floor(containerSize / itemSize);

    The way I fixed it, maybe isn't best practice, but you can modify the data-itemMinWidth parameter to show more/less items. In my case I changed it to 140px to get the 8 items I wanted to have. But with smaller devices it shows less images of course.

    <div class="product-slider" data-product-slider="true" data-itemsPerSlide="1" data-itemMinWidth="140">

    If there is another way to set a fix itemsPerPage value, I would be glad to hear about it. Smile

    ps. I worked with Shopware Version 5.2.21

Anmelden oder Registrieren, um zu kommentieren.