Changing Color of Yext Logo in the Footer

Search Best Practices - Search Front-End
1

Hi,

I want to make the answers background dark to match my clients website and branding. However, this makes it so the black Yext logo isn’t visible in the footer. Is there a way to either change the color of the logo itself or change the image for the logo so that it looks like this:

image

If it’s not possible to make this change, is there an issue if this logo is not visible?

2

Hi Micaela,

You can apply CSS in the answers.scss file to change the color of images. In this case, you can use an invert filter to change the logo to white. Note this inversion works since you are changing the image color from black to white.

.Answers-footerLogo {
    filter: invert(100%);
}
3

For a more complex way to do this (or maybe you want to use another logo color):

  1. Save new logo to static > assets > images
    image
    image833×698 42.6 KB
  2. Override theme for yext-logo.hbs tools > jambo commands > override theme > yext-logo.hbs and edit img src to include your new image
    image
  3. You may need to edit the css to get the appropriate sizing. You must reference .Answers-footerLink outside of the .Answers object
    image
1 Like