3

We are working on Sitecore "Arabic" and "English" languages. As you know Arabic start from right to left and English start left to right. Due to this reason we have to write two class for same element div,button,form etc.. For example "Arabic Header" and "English Header".

How to maintain this in Sitecore?

Should i have to create Asset folder with two sub folder "En" and "Ar" and then render by current context language?

Should i have to include all css in media library and render base on that?

What is the best practice?

Improve this question

1 Answer 1

Reset to default
4

Better to add class to body tag:

<body class="ar">

In code it will be look like:

<body class="@Html.Sitecore().GetBodyCssClass()">


        public static HtmlString GetBodyCssClass(this SitecoreHelper helper)
        {
            var cssClass = string.Empty;
            if (Context.Language != null && Context.Language.CultureInfo != null)
            {
                cssClass = Context.Language.CultureInfo.TwoLetterISOLanguageName.ToLower();
                if (Context.Language.CultureInfo.Name.ToLower() != cssClass)
                {
                    cssClass += " " + Context.Language.CultureInfo.Name.ToLower();
                }
            }

            return new HtmlString(cssClass);
        }

Also you need to have one css file with defined styles like:

body.ar .main-slider {
    left: auto;
    right: 50px
}

It means that you need to have separate styles for ar language (LeftToRight styles). You can use ASP.NET Bundles for join your all css files.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.