Custom stylesheets

Support
34

Hi @betternote,

What you try to achieve is perfectly achievable, see here. Supposing that your address is OK, there are two ways to do it:

<style>
  @import "/Users/myprofile/.config/joplin-desktop/special.css"
</style>

or

<link rel="stylesheet" type="text/css" href="/Users/myprofile/.config/joplin-desktop/special.css" />

Your <style> block had an invalid syntax, and neither the tilde nor environment variables nor relative (to what?) paths will do the job. The full path must be hard coded.

The imported style sheet will overrule /Users/myprofile/.config/joplin-desktop/userstyle.css, because the last specification always wins.

Edit:
What I’ve said there about the cascade is not quite correct. The processing sequence is:

  1. the built-in script noteStyle.js (parametrized, so it adapts to the chosen theme)
  2. ~/.config/joplin-desktop/userstyle.css
  3. hard coded <style> blocks and links to other CSS files in your notes, in the order of their presence (their position relative to the real content of the note has no influence)
  4. hard coded styles= attributes in HTML tags in your notes
1 Like