Custom font for Navigation Inline menu element

Support
#1

Hi,

I added uploaded some .ttf fonts to my site per the directions here
https://xthemetips.com/adding-your-own-font-to-x/139/

Is it possible to apply these fonts to a Navigation Inline element?

Thanks,

J

#2

Hi J,

Yes, it is possible. Go to Customize tab and then add the helper class: customfont
Then let’s update the declaration to this:

.customfont > li > .x-anchor .x-anchor-text-primary {
  font-family: 'Tofino' !important;
}

Hope this helps.

#3

Thanks so much Lely, that worked great.

I’d also like to apply the font to the text on two header buttons and footer text.
I tried adding the helper class to them but it didn’t seem to change the text.
I also tried creating new classes for them with no change.

J

#4

Hi There,

Is this your website: https://www.staging3.dangerpress.com/?

I couldn’t find any buttons on the header.

For the footer text, please add the following CSS:

body > .x-container.max.width {
    font-family: 'Tofino' !important;
}

Regards!

#5

Thank you Thai.

Yes, that is the correct site. In the header, on the right, under the social icons, the phone number and email address are setup as buttons


I tried the css and wasn’t able to effect the text in the footer.
Here’s more info on the text

J

#6

Hi,

You can try this code instead.

.customfont span {
    font-family: 'Tofino' !important;
}

You also need to add customfont class to your element in the footer.

Hope that helps.