So I'm new to Joplin, just made the switch over because Evernote Legacy is finally being shut down. So far Joplin is working pretty nicely, but I'd really like to be able to switch the font of the rendered markdown to be in Garamond.
I've looked up forum posts and guides for how to modify the userstyle file, and used someone's template to add this:
body {
font-family: "Garamond, sans-serif";
/* sets body font /
font-size: 24px;
/ sets body text font size in pixels /
color: #ff00ff;
/ sets body text font colour */
}
(I don't care about font size or colour, they're just there to help see if the change takes effect). Anyway, no matter what I do, the change never seems to come into effect (and yes this is with me properly quitting Joplin between changes and starting it back up). Is the code wrong? Is there something else I need to be doing? I only really have a basic knowledge of cvss, so if I'm missing something really obvious, I'd appreciate the help. I've tried following the guides left in other forum posts, but for some reason it's not working. I'm using Joplin 2.13.15 on Windows 10.
Your css could be failing because you only have to quote font names for ones that have a space in their names, like "Times New Roman" and then it is only for that font, not all the fonts listed. So it would be something like...
font-family: "Times New Roman", serif;
You are not specifying any fonts with two more more words in their name so try the below in your userstyle.css file:
body {
font-family: Garamond, sans-serif;
/* sets body font */
font-size: 24px;
/* sets body text font size in pixels */
color: #ff00ff;
/* sets body text font colour */
}
I do not have Garamond installed on my system but the above css still does this to my copy of Joplin...
CSS has a habit of having a sulk if it encounters something it cannot understand and may ignore everything afterwards.
Is there anything else in your userstyle.css file?
Also is the userstyle.css file in <userfiles>/.config/joplin-desktop?
(where <userfiles> is /home/username (Linux / Mac) or C:\Users\username (Windows) and username is the account username)
Finally, are you editing it with a plain text file editor?
I am using Linux and I found a "two word" font on my system called Caxton Std. I put this is my empty userstyle.css file at /home/username/.config/joplin-desktop/userstyle.css
body {
font-family: "Caxton Std", serif;
/* sets body font */
font-size: 24px;
/* sets body text font size in pixels */
color: #ff00ff;
/* sets body text font colour */
}
and after Quitting and restarting Joplin I got this...
There's nothing in the file save this one bit of code. The full entry currently reads:
/* For styling the rendered Markdown */
body {
font-size: 24px;
/* sets body text font size in pixels /
color: #ff00ff;
/ sets body text font colour */
}
Because I was just trying to test if even the colour alone would work (it didn't).
The userstyle file is located in that address. Specifically at OS(C:)/Users/name/.config/joplin-desktop.
When I open the file it opens with the system notepad app, which is what I've been using to edit it.
Garamond is definitely on my computer. I've used it previously in apps, and when I search in 'Font Settings' it shows up as an entry, though it does note it has three font faces (if that means something relevant).
Even trying that piece of code you just made, it has no visible change. Something that is noteworthy though is that when I go into the split view of markdown/rendered side by side, the text on the rendered side appears in garamond, but when I try to switch to only rendered view, it's no longer in that font. Honestly bamboozing.
To summarize - nothing I have put in the userstyle file has managed to have an impact on what my rendered text looks like, not even just in changing the colour.
^ split view with rendered in garamond. when i togged to the only rendered view, it's by pressing the [edit] button beside the one highlighted in yellow
And the info from help> about:
Joplin 2.13.15 (prod, win32)
I asked for the About info to see if you had any plugins. You don't.
It looks like you have imported your Evernote notes as HTML and that may be what is causing some problems.
The button to the right of the [M↓] button is not viewer only. It is a different editor. It is the Rich-Text (WYSIWYG) editor. The Markdown editor layout modes are toggled using this button
And what what it toggles between is controlled here...
How far are you into transferring from EN to Joplin? I ask as importing as Markdown rather than HTML may lose some formatting in your notes (Markdown is not as versatile as HTML) but later editing will be easier.
Haha algoods. Thank you for your help so far. It really is only a small cosmetic issue I'm trying to change, so it's not super important - definitely not awake at 2AM quality material
I did transfer all my files from EN to Joplin using .enex files, whatever impact that has - it seems to have carried across all in text formatting (and maybe therefore the Garamond font I was using for those files in Evernote).
I have something like 700+ notes across more than two dozen notebooks, so if it comes down to having to re-import things or just give up on changing font, I won't be too fussed.
There are two options when importing ENEX files, as HTML and as Markdown.
As HTML imports from the ENEX file as HTML to try to keep as much HTML formatting as was used by Evernote. The downside is that the raw note is packed with HTML code and so is hard to read and edit later. Joplin actually classes the note as an HTML note type. So this and the HTML code may also interfere with custom css files.
As Markdown converts the note to Markdown. This is a much simpler formatting method so some formatting may be lost if there is no equivalent to the HTML used in the EN note. The upside is that the raw note is easy to read and edit (and custom css works!).
Okay, that makes sense, thanks for clearing that up. I checked, and the notes I imported are in HTML. Since the format will make CSS complicated I'll maybe leave this for now. I'd be nice to be able to change the font, but in the end its not super important (and honestly the thought of having to re-import all my notes in a different format makes me want to throw my computer into a lake). Definitely thanks for the help though. At the very least I now know that a) if I want to make an endeavour to change my font in future what I'm actually trying to change is the rich text editor font, and b) that this process might work easier when I'm working with notes that have been made fresh in joplin and don't have the imported formatting,
