What I want to do:
Add a class around wide blankets of content, and retain the rendering on the inside
Why?
I want to use Obsidian to publish up basic D&D campaign notes, but hide some of the contents from my players so that I can use it both for worldbuilding and notes exposure as they discover things.
What’s the issue:
All the plugins I’ve tried that wrap content in a wrapper and add a class break the rendering of contents on the inside, like callouts or tables.
I’ve tried Highlightr and a few others that apply styles to different highlighted bits, but nothing I’m seeing is retaining all the inner rendering and just ‘surrounding’ it in something with a class.
Any plugins that do this perfectly with a defineable class?
Thanks for the idea! Unfortunately I’m really looking for the visible content to be the ‘chosen’ content, instead of the opposite. Main use case would be the worldbuilding database, with small chunks marked for visibility. Its frustrating because I’m super close (with the Digital Garden plugin) to getting this concept close to perfect, but it breaks down longterm if I can’t ‘present’ any of the fancy content or see things live.
# Header 1
Test Text
Bold Test Text
## Header 2
>[!NOTE] Note title
>This is a warning
More Test Text
| Table Column 1 | Table Column 2 |
| -------------- | -------------- |
| Content 1 | Content 2 |
And I want to wrap everything from ## Header 2 to the table in something that gives the whole section a CSS class. Importantly though, I need everything inside the wrapping to retain md formatting across modes.
Might end up looking something like:
# Header 1
Test Text
Bold Test Text
<span class="testclass">
## Header 2
>[!NOTE] Note title
>This is a warning
More Test Text
| Table Column 1 | Table Column 2 |
| -------------- | -------------- |
| Content 1 | Content 2 |
</span>
There are many plugins like Highlightr that work great for a single line (by wrapping them in a <mark> html), and others that successfully wrap sections of lines/blocks in <span>s or <div>s, but all of the multi-line/block wraps I’ve found break the md formatting of the content on the inside of the wrap.
Got it. Thanks. It makes it a bit easier with a concrete example. As mentioned in the above link
Obsidian does not support using Markdown formatting or blank lines inside of HTML tags.
You could use a custom callout to “tag” an entire section. Markdown formatting, links, etc., will work inside that. You can even try adding headings, but headings inside callouts won’t be indexed as headings or show up in the Outline tab. They will change size and pick up any styling you’ve set though. e.g.
# Header 1
Test Text
Bold Test Text
> [!custom-1] name name
> This is a warning
> More Test Text
> [[link]] **bold** _italics_
>
>
> | Table Column 1 | Table Column 2 |
> | -------------- | -------------- |
> | Content 1 | Content 2 |
After messing around with this a little bit, it’ll work great I think! Thank you so much for the idea, Ariehen.<3
One more question for my sanity, know a simple way / keyboard shotcut to add a > to the beginning of a bunch of lines? I’d love to hijack the tab button.
As for the formatting, I’m a fan of the Insert callout command. Get everything how you want it → select text → run Insert callout command and everything is (mostly) wrapped up nicely in the callout → change the callout name. You can even wrap multiple callouts using the command. (There’s also the Insert blockquote command for only the >s)