Slickのドットの数が足りていないので、正常に表示されるよう実装したい

前提・実現したいこと

ECCUBEのカート内レコメンドプラグインのアップデート時にSlickが導入されたのですが、
そのSlickの動作がおかしい。
スライド下に表示されるはずのドットが足りず、正常表示されるように実装したい。

発生している問題・エラーメッセージ

スライドの表示件数は「８」
1画面に4枚表示、2枚ずつスクロールの設定にしているが、ドットの表示は2つ。
余ったスライドが表示されている時にはアクティブなドットが表示されていない。

該当のソースコード

js
1<script>
2$(function(){
3    $('#plg_recommend_in_cart_area .product_items').slick({
4        dots: true,
5        arrows: false,
6        autoplay: true,
7        speed: 400,
8        slidesToScroll: 2,
9        infinite:true,
10        slidesToShow: 4,
11    //レスポンシブでの動作を指定
12    responsive: [{
13      breakpoint: 768,  //ブレイクポイントを指定
14      settings: {
15        slidesToScroll: 2,
16        slidesToShow: 2,
17      }
18    }]
19  });
20});
21</script>

試したこと

プラグイン内で設定するスライド表示件数を変更してみた。
数によってドットが足りなくなることはなくなるが、
条件によってカルーセルに表示される写真の数は変わるので、どのような状態でも正常にドットが表示されるようにしたい。

補足情報（FW/ツールのバージョンなど）

初めての質問になります。
足りない情報などありましたら、随時加筆させていただきますので、どうかお力を貸していただけますと幸いです。

何卒宜しくお願いいたします。

スライド1枚目のドット

スライド3枚目のドット

Lhankor_Mhy

2020/06/10 10:23

slickの読み込み部分をご提示ください。

Lhankor_Mhy

2020/06/10 10:24

あー、いや、違う。すみません、不要です。

mai24451

2020/06/10 10:26

プラグインがブロックになっており、そのtwigに直接スクリプトを書き込んでおります。

Lhankor_Mhy

2020/06/10 10:34

実際のページを拝見することはできますか？同じ現象が起きている他のページでも構いません。

mai24451

2020/06/10 10:41

ありがとうございます。ステージングの環境になるので、実際にお見せすることが難しいです・・・今までslickで同じ現象になったこともなく、同現象が起きている方を見つけることも出来ずで・・・申し訳ありません。

Lhankor_Mhy

2020/06/10 10:43

そうでしたか…… スライドを動的に追加しているのではないかな、という疑いを持っているのですが、そのようなことはありませんか？

mai24451

2020/06/10 10:58

その通りです。動的に追加しております。この場合だとやはり問題があるのでしょうか？

Lhankor_Mhy

2020/06/10 11:04

PHPで動的に追加されているのであれば、問題はないです。 JavaScriptでページ表示後に動的に追加されているなら、対応は難しいかと思います。

mai24451

2020/06/11 01:52

恐らくですがjavascriptで追加していると思われます。こちらの回答をヒントに、「動的追加 slick」などで検索し、オプションの書き方を下記に変えてみました。 ------------------------------------------------ <script> function sliderInit(){ $('#plg_recommend_in_cart_area .product_items').slick({ dots: true, arrows: false, autoplay: true, speed: 400, slidesToScroll: 2, infinite:true, slidesToShow: 4, //レスポンシブでの動作を指定 responsive: [{ breakpoint: 768, //ブレイクポイントを指定 settings: { slidesToScroll: 2, slidesToShow: 2, } }] }); }; sliderInit(); </script> ------------------------------------------------ ですが、挙動としては同じになってしまいました。また、プラグインの開発会社にもお問合せをお送りしました。何らかの回答があり問題が解決しましたら、こちらにも追記させていただければと思います。お忙しい中、ありがとうございました。