This blog uses Obsidian as a CMS, I like the workflow of Obsidian and some of its MD extensions are neat.
I've written a lot of code to make my blog look like Obsidian, but I've also done a small amount to make Obsidian work like the blog. Let's get into it.
Selected property view:
I sort my posts by date and also by "series" It would be good to have a way to see which series a post belongs to.
In the file view any non .md file has this cool little bubble next to it:
It got me thinking maybe I can do something similar with a selected property value. I have them marked like folders on the blog site but these "series" tags are an Obsidian property I set in my metadata.
Site:
Obsidian:
Thankfully Obsidian's plugin development workflow is pretty straightforward, the hardest thing about making this plugin was finding the methods I needed in its API, it's all typescript, so I felt right at home.
First we collect all the files:
typescriptconst files = this.app.vault.getFiles();
Then for each file we can
- Find its file viewer UI element.
- Extract its metadata
- Inject a div next to the file name in the viewer (or update the existing one)
typescriptconst fileLeaf = document.querySelector(`[data-path="${f.path}"]`);
// For some reason theres only a callback api for this...
const frontMatter: any = await new Promise((res,rej) => {
return this.app.fileManager.processFrontMatter(f, (fm) => res(fm));
});
// Add the child to fileLeaf if it doesnt exist, update if it does
Finally, we can listen for every time a file is updated, and call this method on that specific file in case its metadata updated.
typescriptthis.app.vault.on("modify", (afile: TAbstractFile) => {
const file = this.app.vault.getFileByPath(afile.path)
if(!file) return;
this.setForFile(file)
});
Not bad for a couple of hours worth of programming after dinner, now my file tree looks like this in Obsidian.
See the source code here: https://github.com/ACarling/obsidian-property-marker
I'll likely submit this for review to Obsidian and see if I can get it included in the community plugins list, maybe someone else will find it handy.
"Nav weight" (my fork)
My site sorts posts based on a "created" metadata tag, this is a date string in Obsidian like dd/MM/YYYY. It being a date string allows me to edit it with the built-in widget and gives some nice icons and whatnot
I want to sort my pages based on this property to keep me from loosing track. There surprisingly weren't any plugins for this, I did however find this one obsidian nav weight which sorts files based on some configured property. Thanks shu307!
The original developer set up a heap of safeguards and such so I could literally just change 4 lines of code in the existing "parseMarkdown" function
typescriptweight: -new Date(frontmatter[parsingKeys.weight]).getTime()
// all 4 lines were exactly this change
And hey presto, even if the created tag has invalid data it won't break, it will just throw the item to the bottom of the list (again, thanks shu307).
Community plugins:
The three community plugins I have are:
Auto Template Trigger
This one allows me to apply my blog metadata template to any new note I make. That template looks like this:
{{date}} will autofill with the current date and a nice widget which lets me edit it. The other fields you will be familiar with if you saw the top of this post.
I used a plugin which updated a "created" and "updated" property automatically, but I found that sometimes I wanted to have more control over it than this i.e if I go back and fix a spelling mistake I don't necessarily want to bump the "edited at" timestamp
Front matter tag suggest
This is an extremely good plugin for me since I'm essentially using front matter to sort and categorise my posts Its great to have an autocomplete feature which works on like front matter tags. E.G.
This make adding metadata bot a lot less painful and a lot less error-prone.
LanguageTool plugin
This one is pretty straightforward, it uses the free Language tool to do advanced spell and grammar checking, but this is pretty necessary if I'm going to be publishing things. It is also a very clean plugin.