Add button to front page slider?


#1

Hi,
Is it possible to add a button to the front page slider?
I would like to add a “Call us” button -and offcourse when you press it, you will call us;) Here is my site: www.autobaerum.no


#2

Hello there,

In order to achieve that objective, could you please try to do the following?

  1. Install and activate the Header and Footer Scripts plugin
  2. Go to Settings > Header and Footer Scripts panel
  3. Paste the following code into the “Scripts in footer:”

<script>
jQuery(function($) {

     var myButton = '<a href="tel:+001122" class="roll-button button-slider">My Button</a>';

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

});
</script>

Replace +001122 to your telephone number.

  1. Save settings

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Warmest regards,
Kharis


#3

Thank you, it worked perfectly:)


#4

You’re always welcome here.

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis


#5

Hi Kharis,

how to change the color of my second button? Just the second button.

Thanks,
Cotignac


#6

Hello Cotignac,

Could you please share the URL where I can see your second button? What does its text say?

Regards,
Kharis


#7

Kharis,

this is my site. I want to change the 2. button background color.

Thanks,
Cotignac


#8

Hello Cotignac,

Could you please try to apply the following CSS code through the Simple Custom CSS plugin or child theme’s style.css?

.button-slider:last-child{
  background-color: #fff000;
  border-color: #fff000;
}

.button-slider:last-child:hover{
  background-color: transparent;
  color: #fff000;
}  

Adjust the hex color code to any color of your choice.

Regards,
Kharis


#9

Thank you Kharis, it’s perfect! You are so helpful and quick, thank you everything.


#10

No problem! Just go easy on it.

If you don’t mind, could you please rate our Sydney theme here? We would highly appreciate it if you do so.

Regards,
Kharis


#11

Ok, I will, but now: “You cannot create new topics at this time.”


#12

Sorry for inconvenience. Please try again.

Regards,
Kharis


#13

I want to have front page like this http://autobaerum.no
It is static.

This is my page. http://nazerkhan.com


#14

Hello @princess,

Please try this solution.

Regards,
Kharis


#15

Hello @kharis,

I tried that solution but still not same like http://autobaerum.no.

Let me tell you how I did.

I copy below code and paste it at my simple custom CSS and save.

======================================
jQuery(function($) {
var myButton = ‘My Button’;
$( ‘.slide-inner’ ).append(myButton);
});


#16

Dear @kharisblank

i followed your suggestions on this page regarding the second slider button and it worked like a charm by using the code snipped. However: is it possible to adjust the gap between the buttons? ATM there a bit to close in my opion. If so is it done in the CSS sheet or with another part of the code?

Thanks in advance and thank you so much for the nice theme!

Regards
tosh


#17

Dear Tosh,

Could you please try to apply the following CSS code through the Simple Custom CSS plugin or child theme’s style.css?

.button-slider:last-child{
  margin-left: 20px;
}

Regards,
Kharis


#18

Exactly what I was looking for.

Thanks!


#19

No worries. Just go easy on it.

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis