How to add slider in Related products in Dawn

[NOT1]

 How can i change this like this (as how i have for collection):

[saim007]

@NOT1 Yeah you can do this by putting slider code in the you may also like section.

[Small_Task_Help]

Hi,

Add a Slider Library
Add CSS/JS Files
Edit the Related Products Section
Initialize the Slider

Code example

<script type="text/javascript">
  $(document).ready(function(){
    $('.related-products-slider').slick({
      slidesToShow: 4,   // Number of products to show
      slidesToScroll: 1, // Number of products to scroll per click
      autoplay: true,    // Enable auto-slide
      autoplaySpeed: 3000, // Auto-slide speed in milliseconds
      arrows: true,      // Enable navigation arrows
      dots: false,       // Enable pagination dots
      responsive: [
        {
          breakpoint: 1024,
          settings: {
            slidesToShow: 3,
          }
        },
        {
          breakpoint: 768,
          settings: {
            slidesToShow: 2,
          }
        },
        {
          breakpoint: 480,
          settings: {
            slidesToShow: 1,
          }
        }
      ]
    });
  });
</script>

Use CSS for style

[NOT1]

I dont know much about these can u pls explain me step by step and give the codes