[Resolved] Install Custom Font not using Google

Home Forums Support Install Custom Font not using Google

  • This topic has 2 replies, 2 voices, and was last updated 12 months ago by Tom.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #1020133
    julie

    Hi,
    I apologise if this question has already been asked but Im following the step by step instructions and am stuck at one part – Using @font-face.

    I have uploaded the font museo using Fox Squirrel because this font is not on Google Fonts. The fonts are in the uploads folder. So Im stuck on where it says to go back to google fonts step 3 and view the css and add the url.
    Using Fox Squirrel the download includes a css file and in that css file is:

    @font-face {
    font-family: ‘museo’;
    src: url(‘museo_500-museo.eot’);
    src: url(‘museo_500-museo.eot?#iefix’) format(’embedded-opentype’),
    url(‘museo_500-museo.woff2’) format(‘woff2’),
    url(‘museo_500-museo.woff’) format(‘woff’),
    url(‘museo_500-museo.ttf’) format(‘truetype’),
    url(‘museo_500-museo.svg#museo500’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    IF I already have the fonts uploaded in uploads dir, the css file isnt uploaded, only the actual necesarry font files. So I know I need to do the css and do the reference to the url.
    Note: I was sucessfully able to install the fonts as custom fonts using elementor bu putting that @font-face or some similar code in custom css.

    So. I find the URL in the details looking at the file in the media library but how do I do this part for css and refering to the url?

    Sorry, Im experienced at making websites and find my way through most things but Im new to this platform. Ive just got lost with this where it refers to using google fonts which Im not using.
    I have the domain under maintenance mode and nothing has been done yet other than to install the theme with the menu on the side. First thing Im doing next is setting up the global preferences

    thank you
    Julie

    #1020145
    julie

    Hi,
    Just letting you know I figured it out. I dont belivie it lol!
    I entered the code using simple css changing it to include the full url and only including .woff and .woff2
    Then I was stuck on the next step. Adding it via the customiser so it shows up in the font list…..different coding always throws me – css, php and what goes where but I followed yor instructions to download the code snippets plug in, entered the code in the instructions “adding it to the customiser” changing to my font, saved and activated it, went back into setting default settings for fonts and bingo, there it is.
    thank you

    #1020585
    Tom
    Lead Developer
    Lead Developer

    Awesome, I’m glad you got it working! 🙂

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.