Render HTML Entities in Live Preview

Use case or problem

HTML Entities are very useful for inserting symbols, for example I frequently use them to insert arrows (→, ⇄) or greek letters (α, γ, θ) into my notes.
They are rendered in “Reading View”, but not in “Editing View” with Live Preview mode, which is a shame.

Proposed solution

HTML Entities should be rendered in “Editing View” with Live Preview.

5 Likes

I’m not sure whether   is considered an HTML entity, but it’s certainly something HTML-y that does get rendered in reading mode but not in live preview. It’s also something that I use regularly, so this would be an appreciated feature.

I made a plugin that automatically replaces HTML entities with their actual characters. It’s not quite the same as rendering them in the live preview but maybe it could work anyway.

https://github.com/VisibleReality/obsidian-html-entity

2 Likes

Sweet, I’ll give it a go!

Works perfectly, thanks!

For anyone who isn’t already aware, on Windows you can press Win + . (Windows key plus period), and it will open a nice character picker for those advanced symbols, along with emoji and some other useful stuff:

You can do the same thing on a Chromebook and I’m sure there’s a similar command on Mac.

On the Mac the sequence is to click Edit->Emoji & Symbols and then select the character you are looking for.

I would also heavily support the implementation of this feature. It doesn’t look very good (especially in comparison to other Markdown-editors) seeing things like Go to A → B.
The proposed solutions (plugins to replace an html-entity with its symbol counterpart or directly inserting the wanted symbol) is not the same. I want my Markdown-documents to be usable and the same on each application, so the html-entity should stay as is. Just the rendering should include it as well.

I’d also love to see this implemented. I use arrows and other HTML entities a lot, and it became muscle memory at this point, and rendering them in the live preview would make things much better for me.

There is no such function or solution, it would make certain activities much easier and shorten their time. Plugins are not as suitable for what we want to achieve, and using arrows and HTML elements is sometimes quite tiring. Continuously repeating the option of going to editing, then emojis and symbols, and finally searching for the necessary character.

The discussion seems to have devolved into a way to quickly choose and enter non-language characters like emojis and arrows.

The real problem is that Live Preview will render inline html tags, but not inline html character entities. I suppose this could be considered a feature request, but it seems like a bug to me.

To see what I mean, stick these two lines markdown in a note and compare Reading view with Live Preview editing mode:

This is <span style="color: red;"><em>a test</em></span> that uses inline HTML.

This is a test that uses HTML&nbsp;character entities&mdash;which is also inline HTML.

Because I think this is a bug, I’ve submitted a bug report here.