I found myself wanting to comment on some of my notes I was taking on a Zoom meeting and after Googling a bunch I didn’t really find anything that fit exactly my vision which is:
- extremely simple
- in document
- in line
- using custom markdown code
Sure I could use callouts and style them but they both require their own line and multi lines. I wanted to make comments within bullet point lists. Also because of all the code required to make a callout, when you go to edit the callout the text jumps to a totally different place and is confusing.
With only two trailing markdown characters, it’s very simple to edit the note itself in my version.
My solution. Very hacky. If anyone wants to improve on this, knock yourself out.
The forum isn’t letting me add links, sorry, so you’ll have to find these things yourselves.
First install the Extended Markdown syntax plugin. You can find it in the Community Plugins in the app.
Then choose which custom styling you want to steal for your sticky notes. I chose ++text++ for underline, which I don’t foresee using
Then add this sticky note styling to your Custom CSS (search the web for: pastebin Sticky Notes for Obsidian v3). I suppose you don’t need all of that code and you can just figure out the vars being defined and hardcode them, but I might use the other sticky note styles at some point and I wanted to give credit to the author.
Add this CSS to that file:
.cm-ins, ins {
float: right;
margin: unset;
margin-left: 8px;
text-decoration: none;
background-color: var(--sticky-color-yellow-transparent);
border-radius: var(--sticky-border-radius);
padding: 0.1em 0.4em;
color: var(--sticky-color-text);
max-width: 14em;
margin-top: 5px;
}
That’s it! The only thing to note is that if you want the text to wrap/flow properly around the sticky note, you have to add it before the text you’re commenting on because DOMs render linearly. Maybe someone with advanced knowledge could fix this. I just wrote a Keyboard Maestro command to put the cursor at the beginning of the line, type “++++” and then put the insertion between in the middle of the 4 pluses.
See attached screenshots for the code and the rendering (note I only have a single trailing “+” in the code part because if I add the 2nd one, then it renders the sticky note and you can’t see the code
