[tuskphoto]

There are a few buttons i would like to know how to change the colour of.

1. I would like to change the colour of the Button that says BOOK NOW under the booking tab next to each trip date?

2. Under the reviews tab i would like to change the currently green submit buttons colour as well?

see for reference https://tuskphoto.com/newsite/?itineraries=sabi-sand-photo-safari

[Support Team]

Hello @tuskphoto,

Please find the answer to your queries below:

1. I would like to change the colour of the Button that says BOOK NOW under the booking tab next to each trip date?

Response: For this please add below given CSS by going to Admin Panel > Appearance > Customize > Addiitonal CSS.

.trip_list_by_fixed_departure_dates .trip_list_by_fixed_departure_dates_list .trip_list_by_fixed_departure_dates_booking .btn {
  
    background-color: #4747478f;
}

2. Under the reviews tab i would like to change the currently green submit buttons color as well?

Response: Add below given CSS.

input#submit {
    background-color: #474747 !important;
}

Here change the color code as per your requirement.

Hope this helps.

Thank you.

[tuskphoto]

Thanks very much this worked perfectly. One last thing, i noticed that when the mouse overs over the Book Now Button it doesnt change to a hand, indicating to click on the button, can this be changed?

[Support Team]

Hello @tuskphoto,

Please let us know if you have made any changes in the code as the hand will appear in all the links around the page.

Screen record:
https://www.loom.com/share/24b41f431e3f409abe1b3dbd40a6377b

Please verify and let us know.

Thank you.

[tuskphoto]

I havent made any changes to the code other than the colour of the buttons. The hand appears everywhere except on the book now buttons, both under the booking Tab as well as above on the big button thats says book now.

[Support Team]

Hello @tuskphoto,

It is may be due to the theme layout. But there is nothing to worry as it can be fixed using the CSS below.

Please add below given CSS by going to Admin Panel > Appearance > Customize > Additional CSS.

button.wp-travel-booknow-btn {
    cursor: pointer;
}
input.btn.add-to-cart-btn.btn-primary.btn-sm.btn-inverse {
    cursor: pointer;
}

Hope this helps.

If you have any issue further please let us know.

Thank you.

[Author]

Posts