Add Auto Play in Slick Slider

 তোমার প্রশ্ন — “auto play er jonno ki korbo” — আসলে এর মানে Slick Slider-এ অটো-স্লাইড চালু করতে চাও।

চলো সংক্ষেপে ও স্পষ্টভাবে ব্যাখ্যা করি👇

---

✅ Step-by-Step Solution

1️⃣ Slick JS initialization-এ autoplay যোগ করো

তোমার কোডে এই অংশ আছে:

$('.slider-container').slick({
  centerMode: true,
  centerPadding: '60px',
  slidesToShow: 1,
  arrows: false,
  responsive: [...]
});

এখানে শুধু নিচের ৩টা লাইন যোগ করো 👇

autoplay: true,           // ← auto slide চালু করবে  
autoplaySpeed: 3000,      // ← প্রতি 3 সেকেন্ডে স্লাইড বদলাবে  
pauseOnHover: true,       // ← hover করলে থামবে

👉 Full working code:

$('.slider-container').slick({
  centerMode: true,
  centerPadding: '60px',
  slidesToShow: 1,
  arrows: false,
  autoplay: true,
  autoplaySpeed: 3000,
  pauseOnHover: true,
  responsive: [
    {
      breakpoint: 768,
      settings: {
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 1
      }
    },
    {
      breakpoint: 480,
      settings: {
        centerMode: true,
        centerPadding: '0px',
        slidesToShow: 1
      }
    }
  ]
});

---

⚙️ Optional Tweaks

• speed: 500 → ট্রানজিশন টাইম (milliseconds)

• infinite: true → শেষ স্লাইডের পর আবার প্রথমে ফিরে যাবে

• pauseOnFocus: false → টাচ/ফোকাস করলে থেমে না থেকে চলবে

Example:

autoplay: true,
autoplaySpeed: 2500,
speed: 600,
infinite: true,
pauseOnHover: false,
pauseOnFocus: false

---

⚠️ Common Mistakes (তোমার আগের কোডে যেগুলো ছিল)

1. autoplay property ছিল না → তাই কাজ করেনি।

2. কিছু ক্ষেত্রে multiple sliders থাকলে, class ঠিক করে .js-slick-hero বা .slider-container আলাদা করতে হবে।

3. যদি autoplay চলেও হঠাৎ বন্ধ হয়, চেক করো jQuery বা Slick দুইবার load হয়েছে কি না।

---

✅ Quick Recap

Setting	কাজ
autoplay: true	Auto slide চালু
autoplaySpeed: 3000	3 সেকেন্ড পর স্লাইড বদল
pauseOnHover: true	Hover করলে থামে
infinite: true	লুপে ঘোরে