1. Kayako Download customers: we will continue to develop and support Kayako Download beyond July 2017, alongside the new Kayako for existing customers.

    Find out more.

  2. The forum you are viewing relates to Kayako Classic. If you signed up or upgraded to the new Kayako (after the 4th July 2016), the information in this thread may not apply to you. You can visit the forums for the new Kayako here.

"Submit" "Next"Button text style

Discussion in 'Style and design' started by Chris Smith, Oct 1, 2019.

  1. Chris Smith

    Chris Smith New Member

    Hi, How do I change the colour/color of the text in them Submit or Next Buttons?

    Currently the text is a very close match to the button background and so is difficult to see as shown in the screenshot below. If someone can help me out it would be much appreciated.

  2. bear

    bear Kayako Guru

    How did you find the button color to change it?
    Do that for the text, too. ;)

    Failing that, if you're using Firefox browser, use "inspect element" or the web developer tools it has to find the CSS that likely colors it.
  3. Chris Smith

    Chris Smith New Member

    Hi, I didn't change the button colour of the text colour. This was probably done by a colleague that is no longer with the company. Id be happy to have the default button style reinstated but don't know which css its in.
  4. bear

    bear Kayako Guru

    Have you tried the suggestion I gave about Firefox? Chrome has it too, if you're using that.
    Basically, you invoke/start the inspector, and there's a button to click that will allow you to hover over an element and find what makes it do what it does.

    If you give a link, I'd have a look.
  5. Chris Smith

    Chris Smith New Member

  6. bear

    bear Kayako Guru

    The button color is an "inline" style, meaning it's on the template that drives that look instead of in a CSS file.
    Inline style: "rebuttonwide2".
    If you search your templates for that word, it should find it.
    As for the text color on that button, that's controlled by the link text color on your whole site. Every link is that blue color, including this one. To change that for the buttons (if you wanted to keep the blue button), you'd need to add an element definition, as in:
    .rebuttonwide2 a:link {color="#colorhere";}
    That should color any link inside of that CSS descriptor "rebuttonwide2". Bear in mind it might not stay that color after it's used, since that may be seen as a "visited" link. If you're not sure about CSS and how to use it, you should take some time to learn.

    Strike that. Looking closer, it would appear that some of this gets condensed into CSS in this file:
    If you look in there for that same descriptor, it should have one for "color". That's the one to change
    Last edited: Oct 2, 2019
  7. Chris Smith

    Chris Smith New Member

    Thanks Bear, I'll have a look this afternoon and let you know.

Share This Page