How to add second "call to action" button to the slider?

Hello,

How to add second “call to action” button to the slider?
Could you please suggest some plugin?

Thank you in advance.

Regards, Naira

Hello Naira,

To accomplish it, try doing the below steps:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box
    jQuery(function($) {

         var myButton = '<a href="#" class="roll-button button-slider">My Button</a>';

         $( '.slide-inner' ).append(myButton);

    });
  1. Update

Regards,
Kharis

Thank you very much , kharisblank
It really works.

What about the:

  • size,
    -colors,
  • text of the new button
  • link
    and the space between them?

How it could be regulated?

Hello there,

Try this code:

    /* Button 1 */
    .slide-inner a.button-slider:nth-of-type(1) { 
      margin-right: 5px;
    }

    /* Button 2 */
    .slide-inner a.button-slider:nth-of-type(2) {
      border: 1px solid #ccc;
      background-color: #ccc;
      margin-left: 5px;
    }

    .slide-inner a.button-slider:nth-of-type(2):hover {
      border: 1px solid #fff000;
      background-color: #fff000;
      color: #ff0000;
    }

Regards,
Kharis

Color’s issue also solved. Thank you so much :slight_smile:
What about the text of button?
Could you please provide some code?

Try this code:

.slide-inner a.button-slider:nth-of-type(2) {
   color: #fff000;
}

Regards,
Kharis