Using HelpDocs with RTL Languages

The HelpDocs text editor automatically switches text direction when you're writing an article in an RTL (right-to-left) language like Hebrew or Arabic.

On older templates there's some other parts of your template you'll want to edit to make everything appear in the right (pun intended) direction. When you add an RTL language in Settings > Languages, we'll tell you how well your template supports it.

These snippets have been tested with the Boxed (v3next) template. If you're using another template there may be other customizations required.

The CSS

#main[data-hd-template="boxedinstantv3"] #header input {
    padding-right: 3em !important;
}
@media (min-width: 70em) {
    #header #search-container.search-responsive span {
        margin-right: 6em !important;
    }
    #article .card.responsive-toc {
        margin-right: 0px !important;
        margin-left: 0px !important;
    }
}
#article .tip-callout::before,
#article .note-callout::before,
#article .warning-callout::before {
    margin-right: 40px !important;
}
#article .tip-callout,
#article .note-callout,
#article .warning-callout {
    border-right-width: 5px !important;
    border-left-width: 0 !important;
}
/* Hide authorship on right-to-left pages */
html[dir="rtl"] #article #body p.meta,
html[dir="rtl"] #category #articles p.card-text img,
html[dir="rtl"] #category #articles p.card-text .text-muted,
html[dir="rtl"] #home #categories #category p.card-text:last-of-type {
    display: none !important;
}

The JavaScript

<script type="text/javascript">
    (function() {
        $(function() {
            // This assumes you're using the code in a multilingual setup, converting Hebrew to RTL. 
            // Contact HelpDocs support if you have trouble modifying it for your exact settings!
            if ($('body').data().languageCode === 'he') {
                $('html').attr('dir', 'rtl');
                $('.dropdown-menu-right').removeClass('dropdown-menu-right');
            }
        });
    })();
</script>