Add dir="auto" to all div elements

Things I have tried

Please see the next section.

What I’m trying to do

Currently, I’m using the “RTL Support” plugin to facilitate writing RTL content in Obsidian. However, there’s a minor limitation that is it either formats an entire note as RTL or LTR, meaning that if you want to mix RTL and LTR content, it is not rendered properly. I did a little research and it turns out that the solution is quite simple: just add dir="auto" to all div elements and voila, you don’t even need the “RTL Support” plugin (maybe).

Anyway, what I ended up doing was to manually enforce dir="auto" using the following JS script:

setInterval(
    function fixRTL(){
        document.querySelectorAll("div").forEach(
            (element) => element.dir = "auto"
        )
    }, 40
);

and to load this script, I’m using the “JavaScript Init” pluging, which lets you run a pre-defined script at startup (or on-demand).

The reason I need to use setInterval is because I noticed that everytime I add dir attribute to div elements, when I navigate through the content, it gets re-rendered and as a result, the dir attribute gets overridden with the default value (which is dir="").

This works fine, except that the rendering of mixed LTR/RTL documents is no longer smooth, since the RTL content keeps getting re-rendered LTR, although it transitioned quickly to RTL (because of the JS script), but like I said, it’s a little bit annoying). Here’s a screencast to clairfy what I mean:

Peek 2022-07-31 12-16

My question is: how can I fix this? or more to the point: how can I ask Obsidian not to reset the dir attribute?

Thank you so much,
Amin

Please someone help this Angel that found a simple way for mixed RTL/LTR

1 Like

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.