Button Element Trigger

Design help Animations & Interactions
1

Hello everyone,

I have been using Webflow for about 2 years, but this is my first post to the forum. I would classify my knowledge level as beginner to intermediate. I am designing a website for a client, and I cannot figure out how to adjust the hover element trigger on the buttons. Specifically the “Purchase Books” button, and all of the other buttons styled the same way across the page. Currently, when you hover over the buttons, the button background turns teal, and the text turns white. I would like to program it so that the button background turns red.

When I attempt to adjust the button, and add an element trigger, it shows that there are no settings programmed. So I am perplexed as to where I would adjust that setting.

Here is the site read only link: https://preview.webflow.com/preview/andrew-adeniyi-website?utm_medium=preview_link&utm_source=designer&utm_content=andrew-adeniyi-website&preview=2f22bc98e33f2eda07340477bfb830fc&pageId=5f01ddc780f6943b371d4e49&mode=preview

2

Hi, welcome to the forum!

you can change colors for the hover state following these steps:

  • Start editing your navbar by double clicking it
  • Select your button (for the “Purchase Books” button, it should be the element called “Button Outline”)
  • Select the hover state by clicking the blue arrow in the selector panel:

grafik

  • Scroll down all the way to “Backgrounds” and change it into the desired color:

grafik
grafik562×595 19.4 KB

You can change the font color of your regular navbar elements with the same procedure.

Hope it helps!

3

Thank you ChrisT! That was surprisingly easy!