Utilising custom font stack

#1

I’m sure this is already exposed in the CSS and I just can’t find it, but is there any way to define my own fontstack, or throw my own font on top of the existing fontstacks for posts?

I can easily @import a webfont in the custom CSS but defining them as the font-family for body {} doesn’t apply everywhere as it should. What am I missing?

1 Like
#2

Yep, you can definitely do that. Just use the @import like you’re doing already, include article in your CSS selector, and add !important, e.g.:

@import url('https://fonts.googleapis.com/css?family=Roboto');

body, article {
    font-family: Roboto, sans-serif !important;
}
Fonts for RTL languages
#3

Y’know, I’d expunged !important from my memory. Thanks!

@matt Out of interest, what’s the existing fontstack, officially? I don’t want to break compatability for people who can’t use my webfont provider for whatever reason.

#4

No problem! Official font stack is Lora (serif), Open Sans (sans), and Hack (monospace). Full CSS rules:

.sans {
  font-family: 'Open Sans', 'Segoe UI', Tahoma, Arial, sans-serif;
}

.serif {
  font-family: Lora, 'Palatino Linotype', 'Book Antiqua', 'New York', 'DejaVu serif', serif;
}

.mono {
  font-family: Hack, consolas, Menlo-Regular, Menlo, Monaco, 'ubuntu mono', monospace, monospace;
}
#5

Blowing me away with these four-minute responses. :purple_heart:

(Sidenote: As a Writefreely user who is incredibly impressed with just how good this is becoming, how can I contribute to your ability to work on this project?)

1 Like
#6

:slightly_smiling_face:

I’m glad you like it! And I really appreciate you wanting to help out. There are a few things you (or anyone) could do, which would contribute a lot:

  • Responding to others here on the forums, on the GitHub repo, or anywhere else where people are discussing the project
  • Continuing to offer feedback, file bug reports, test out new releases, and let me know how you’re using WriteFreely, so I can be sure the platform is always built around the people using it
  • Help fund the project via Patreon, Liberapay, etc., so we can reach financial sustainability sooner, and ensure the project is here to stay
2 Likes