Have Live Preview while editing a callout (Edit callouts progressively and maintain live preview of items not being edited)

I want to share a thought about a thing that I really find annoying using Obsidian. I usually use Callouts to gather parts of my notes, and each time I edit them the layout in Live Preview messes out, showing the code like Source Mode. I thing a Live Preview editing mode would really increase the overall experience using Callouts especially where inside the the are links, attached files or images, or even when multiple callouts are concatenated. I mean it should work like the new table editor or code block, where layout remains during editing.


Use case or problem

Callouts in “edit mode” shows all the text as in “source mode”

Proposed solution

Editing Callouts should maintain the UI as in “Live preview”


9 Likes

I totally agree. I have posted a similar feature request here: Live Preview: Make HTML renderings editable.

If one wants to only edit the content of the callout, a switch back to the source mode is not necessary. Only use source mode for the most nested callout block the cursor is currently in. Editing ‘callout block structure’ could be done similar to lists, via tabbing.

At least making this behaviour optional, would be much appreciated.

1 Like

I’m having the same issue right now. Would love to be able to edit callouts like any other text/lists/etc. There’s already a “edit this block” button on them. I can use that if I want to see the markdown.

Same. I absolutely hate trying to edit a callout because clicking on it suddenly means all the coding expands, all of it is highlight and i have to scroll and click where i wanted the cursor to be again and if i want to put a bunch of code in there like html or am using a plug in to make columns with callouts… I have to scroll through it all, and it’s such a pain. It also interferes with certain things like toggles and text box inputs, such as with the meta bind plug in, where I can’t click them in editing without it opening the entire callout source. Please just let us be able to edit it like other things and only show the code if we hit the source button.

1 Like

I would love to have that too.

There’s a few missing features in Obsidian like easy callout editing that stops it from completely dominating the market.

Developers team if you can make this happen it would be :fire:

1 Like

I would like to propose an enhancement of the existing Table editing feature added with 1.5.3 update.

Use case or problem

At the moment it is not possible to edit table cells of any table nested inside callouts.
Focusing on a table inside a callout while in live preview mode results in the source code of the parent callout to be revealed (see below).

TableEditingCallout

Proposed solution

Allow for tables nested inside callouts to be edited in the same way regular ones are.

Current workaround (optional)

Edit tables from the source code or do not use tables inside callouts.

6 Likes

Ran into this problem a few times. It’s annoying but I think the fix won’t be trivial, since the callout block is being turned into source as you’re editing it, but the table inside the block is supposed to be previewed (hence the contradiction).

So here’s my easy workaround: make your table nice and neat outside the block, then simply cut and paste it into the callout block.

That is until the Obsidian team finds a way to resolve that contradiction.

Use case or problem

I often write latex math into admonitions / callouts. Whenever I do so, however, the math doesn’t render in live preview:

despite the fact that live preview usually displays callouts that you’re editing as if they were quote blocks, which do render latex:

Proposed solution

Just have live preview treat admonition boxes the same way it treats quote boxes and render latex in them.

Current workaround (optional)

If the math is sufficiently complicated that I don’t want to deal with not being able to see a preview, I sometimes write it first as a quote block and then only add the [!Proof] part when I’m done.

Related feature requests (optional)

2 Likes

Are you certain that it does not work as expected? I have just given a try to the same block of text:

> [!proof]
> We clearly have that $a+b=c$. and thus that $$e^{i \pi}+1=0$$. **Q.E.D.**

and it has been properly rendered in the Live Preview:

It renders it fully and correctly in the live preview when your cursor is outside it, but while you’re editing the admonition it displays in live preview basically the same way a quote block does, except for the fact that it doesn’t render the latex.

+1, I specifically came to the forum today to request this (I’ve been using the same workaround, too).

+1 I have the same problem

Hi all, my plugin LaTeX-like Theorem & Equation Referencer (previously called “Math Booster”) will remove your headaches.

Also, I wrote another plugin that focuses on this specific problem, so I will remove this feature from LaTeX-like Theorem & Equation Referencer in the near future.

Turned OFF

Turned ON

2 Likes

Use case or problem

As I said here callout doesn’t seem to support image when editing. But, the quote block do. Also, as some markdown clutter disappear, it quickly becomes difficult to work with image in a callout.

Proposed solution

Two solution :

  • Add support of image in callout when editing, maybe impossible because of the way there are embedded.
  • Keep completely the markdown mark as ![[]] or ![]() and $$.

Current workaround (optional)

I looking for maybe a css snippet that can help me.

Related feature requests (optional)

/

2 Likes