CODEWITHSUNDEEP
markdownright-to-left
Karim
Karim

Reputation: 18587

RTL in Markdown

Is there any existing addon spec for markdown that includes support for RTL languages?

What I'm hoping for is something like 

This paragraph is left to right
<- This paragraph is right to left

Or something... I can tweak my parser to handle this but I want to make sure it doesn't exist already.

Upvotes: 102

Views: 31210

Answers (11)

Ali Shariatian
Ali Shariatian

Reputation: 143

You can use:

<div align="right">
   این متن test است
</div>

or:

<div dir="auto" align="right">
   این متن test است
</div>

or (recommended):

<div dir="auto">
   این متن test است
</div>

Upvotes: 13

Belhocine Abdelkader
Belhocine Abdelkader

Reputation: 45

Simple Solution

In Visual Studio Code, you can set the document direction by adding the following comment at the beginning of your Markdown file:

<!-- language: rtl -->

or

also in the beginning of your Markdown file:

if all the file is rtl

<style>
    * {
        direction: rtl;
    }
</style>

or any style you want

or

you can add separate custom css file like we are doing with Html file, like this in the beginning of your Markdown file :

<link rel="stylesheet" href="custom.css">

Upvotes: 3

Shahriar
Shahriar

Reputation: 2380

Since the markdown accepts html, using this trick might be useful:

<style>*{direction: rtl}</style>

متن راست به چپ rtl text

## **rtl title عنوان راست به چپ**

I use this in VSCode Jupyter Notebooks, and the good thing is you can still use markdown tags (which is not possible when you wrap the content in <div dir="rtl"> or any other HTML tag).

Upvotes: 1

Gute1
Gute1

Reputation: 11

when I use align it looks better, but has no indents in bullets and numbering

Upvotes: 0

Makan
Makan

Reputation: 2726

Actually as my friend Aevyz reminded me, Markdown parses HTML in it.

You won't need to change your parser. The quickest path to solve that I could think of is this:

<div dir="rtl">

سلام دنیا

مرحبا العالم

שלום בעולם

ہیلو دنیا
</div>

So you need to add literally two lines to turn a whole document or an arbitrary section of it into RTL. It will be more compatible than an own script.

Upvotes: 112

Koorosh
Koorosh

Reputation: 475

You can simply add everything between span tags like below:

<span dir="rtl" align="right">
      این یک test است
</span>

You may want to check this link to see an example in action.

Upvotes: 6

SeyyedKhandon
SeyyedKhandon

Reputation: 6083

Just use dir="auto" like the below example and it will work as you wanted:

 <div dir="auto">
                با استفاده از attribute dir با مقدار auto در HTML می تونید به طور خودکار RTL رو هم داشته باشید.
  </div>

Upvotes: 17

Dariush Abbasi
Dariush Abbasi

Reputation: 470

I don't find anything in markdown standard for bidi texts. I use my own editor : rtlmd

Upvotes: 16

Alex Cohn
Alex Cohn

Reputation: 57173

Not exactly markdown, but this is how you can override paragraph direction in StackExchange questions and answers (this method does not work for comments):

add &#x202b; (RIGHT-TO-LEFT EMBEDDING) in the beginning of a paragraph does control the direction of this paragraph (auto-reset on <br/> or empty line):

&#x202b;test מה זה? YES<br/>
test1 מה זה? NO
test2 מה זה? NO

&#x202b;test1 מה זה? YES
test2 מה זה? YES

‫test מה זה? YES
test1 מה זה? NO test2 מה זה? NO

‫test1 מה זה? YES test2 מה זה? YES

Upvotes: 39

KajMagnus
KajMagnus

Reputation: 11666

Here is a JavaScript implementation of Markdown, which (according to the commit comments) adds support for RTL languages, namely Arabic, Hebrew, Syriac, Thaana. And it seems trivially easy to add more languages.

https://github.com/hasenj/showdown/

It's based on Showdown, http://attacklab.net/showdown.

It seems to automatically understand whether or not to render the text from right to left.
Consider this code snippet: (from the very first commit at GitHub)

var p_tag = "<p>";
var rtl_p_tag = "<p style='direction:rtl; text-align: right'>";

// Check for RTL paragraphs: paragraphs that start with a character
// from an RTL script.
// RTL scripts are: Arabic, Hebrew, Syriac, Thaana
// Unicode ranges reference: http://www.ssec.wisc.edu/~tomw/java/unicode.html
var first_char = str.charCodeAt(str.search(/\S/)); //first non-white-space char
if(first_char >= 1424 && first_char <= 1983) 
{
    p_tag = rtl_p_tag;
}

    str = _RunSpanGamut(str);
    str = str.replace(/^([ \t]*)/g, p_tag);

Hope this helps,
Magnus

Upvotes: 23

Avi
Avi

Reputation: 16156

מעניין. עכשיו אני רואה שבעצם יש גם לאתר הזה פה תמיכה בעברית וכתיבה מימין לשמאל. הבעיה היא שזה כותב טוב, אבל בתרגום בתיבה למטה שמציגה כמו שזה אמור להראות זה לא עובד טוב.

The above paragraph was written in Hebrew RTL and was displayed correctly in the input box but not in the preview one. However, there was no support for mixing - having one paragraph RTL and another one LTR. Seems someone needs to port the above Hebrew support in Markdown also for MarkdownSharp, SO's version. Shouldn't be too hard.

Upvotes: 9

Related Questions