Different buttons for each slide

Use this code to disable the default slider button and instead create one button for each slides.

jQuery(function($) {
 
   //Define the new buttons. Delete the lines you don't need
   var button1 = '<a href="http://example.org" class="roll-button button-slider">Button 1</a>'; //Slide 1
   var button2 = '<a href="http://example.org" class="roll-button button-slider">Button 2</a>'; //Slide 2
   var button3 = '<a href="http://example.org" class="roll-button button-slider">Button 3</a>'; //Slide 3
   var button4 = '<a href="http://example.org" class="roll-button button-slider">Button 4</a>'; //Slide 4
   var button5 = '<a href="http://example.org" class="roll-button button-slider">Button 5</a>'; //Slide 5

  //Hide the default button
  $('.slide-inner a').hide();
 
  //Add the new buttons. Delete the lines you don't need
  $( '.slide-item:nth-of-type(1) .slide-inner' ).append(button1); //Slide 1
  $( '.slide-item:nth-of-type(2) .slide-inner' ).append(button2); //Slide 2
  $( '.slide-item:nth-of-type(3) .slide-inner' ).append(button3); //Slide 3
  $( '.slide-item:nth-of-type(4) .slide-inner' ).append(button4); //Slide 4
  $( '.slide-item:nth-of-type(5) .slide-inner' ).append(button5); //Slide 5
});

Tips:

1. replace http://example.org with the links you want;
2. replace Button 1 (2,3,4,5) with the text you want for your buttons;
3. delete the lines of code you don’t need.