How to Install CSS snippets

Things I have tried

I have read a number of posts, read the help file but I am missing an obvious trick here. How do I install a CSS snippet? I have one (thanks to TfT Hacker) and it all seems so obvious - put it in the .obsidian folder. BUT where is that folder and what is the process of putting a .CSS snippet in there. I’ve had a look in Settings, which allows me to open the snippets folder, but I can’t see how I get it in there in the first place. No doubt it is very simple and obvious.

Thanks David

What I’m trying to do

In your vault’s root folder you will find a folder named .obsidian - In that folder is a sub-folder snippets (create it if it does not yet exist) now move your css file into the snippets folder. Then in obsidians settings/appearance at the bottom you will need to enable the snippet.

1 Like

To complement what @willasm said, keep in mind that this .obsidian folder is a hidden folder, so you need to activate the option to see hidden folders on your OS in order to see it. Additionally, I use the My Snippets plugin which makes the process of managing snippets way easier. Check it out! GitHub - chetachiezikeuzor/MySnippets-Plugin: MySnippets is a plugin that adds a status bar menu allowing the user to quickly manage their snippets within the comfort of their workspace 🖌.

Here’s an easy way to show that hidden folder:

1 - In Obsidian… go to Preferences > Appearance > CSS-Snippets (at the bottom).

  • Turn the snippets switch to “On”.
  • Click the little folder icon :open_file_folder: above the switch. A popup will appear (that popup is the folder /vault/.obsidian/snippets/).

2 - Drag your snippets.css file into that popup window.

DONE! :beer:

Your CSS file is now located at /vault/.obsidian/snippets/snippets.css.

  • You can open your CSS file in any text editor [like Notepad (Windows) or TextEdit (Mac)] - (a CSS file is just a text file).
  • You can add/change styles in that CSS file.
  • New changes are automatically pulled in by Obsidian, any time you save the snippets.css file.

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.