Let's add rtl feature to editor

Add right to left to right button to editor, so we can support all the language starts from right like Arabic, Hebrew, Uyghur …

thanks!

In its most basic form, this feature should be really trivial to implement. I already implemented it with just a dozen lines of code, in my own fork of the repo. See here

2 Likes

Yes, I saw your implementation, but I think it is very basic thing to add, so I am proposing this now.

Hello,

Does anyone know if Ghost supports left to right languages?

Thanks!

1 Like

Here is a quick solution that worked and solved the RTL issue for me.

I used the CSS and Javascript Injection Chrome extension to add custom RTL CSS styles as follows:

body.ember-application {
  direction: rtl;
  text-align: right;
}

.gh-nav-list svg {
  margin-right: 0;
  margin-left: 15px;
}

.koenig-plus-menu-button {
  margin: -2px -66px 0 0;
}

.gh-publishmenu-dropdown {
  right: auto;
}

.settings-menu-container {
  text-align: left;
  direction: ltr;
}

.gh-publishmenu-dropdown {
  direction: ltr;
}

.ember-power-select-trigger {
  padding: 0 30px 0 8px;
}

.dropdown-menu {
  right: 0;
}

.dropdown-menu svg {
  margin-right: 0;
  margin-left: 10px;
}

.gh-notification-content {
  text-align: left;
}

.koenig-cardmenu {
  left: auto;
}

The code covers the main layout and the writing area …

The result:

The code is available at GitHub.

Hope that helps!

Thanks,

1 Like

Why isn’t Ghost supporting RTL yet, we have been waiting for this feature for a long time. are we gonna expect it in the next few releases or is it not even considered?

Just not that, it doesn’t support other scripts as URL. This particular issue has been stopping me from moving to Ghost from WP.
My website uses Devanagari script which is supported on WP as URL.

It looks to me as though two related issues are being requested here:

  1. Right-to-left (RTL) support, as in @ahmadajmi’s screenshot, where the whole site is assumed to be using a RTL script.
  2. Complex-text-layout (CTL) support (which is what the OP sounds like to me) where at times text is RTL but not always.

I use the second option frequently because I switch between English and Hebrew. That means @ahmadajmi’s CSS solution would not work for me.