Ajout de support pour les environnements locaux RTL
Vous pouvez ajouter du support pour les langues qui se lisent de droite à gauche.
Procédure
-
Si votre fichier theme.html contient des chaîne susceptibles d'être traduites, créez un nouveau fichier nommé theme_rtl.html dans le répertoire nls. Ensuite, modifiez la section Head de votre fichier theme.html afin d'y inclure les balises de lien suivantes pour les environnements locaux qui pointent vers le modèle de thème :
<link rel="alternate" href="nls/theme_rtl.html" hreflang="ar"><link rel="alternate" href="nls/theme_rtl.html" hreflang="iw">Si votre fichier theme.html ne contient pas de chaînes susceptibles d'être traduites, vous devez disposer d'un modèle de thème pour chaque environnement local dans le répertoire nls qui inclut les balises de lien suivantes :<link rel="alternate" href="nls/theme_rtl.html" hreflang="ar"><link rel="alternate" href="nls/theme_rtl.html" hreflang="iw"> -
Ajoutez l'attribut suivant à la balise HTML dans l'autre modèle de thème :
dir="rtl". -
Générez des versions RTL de styles dans les fichiers CSS qui indiquent la direction, par exemple, float, padding et margins. Les versions RTL de ces classes remplacent la direction. Ces classes sont situées dans un ou plusieurs fichiers CSS distinct. Par exemple, la classe suivante, qui indique float, doit être remplacée :
Dans le fichier CSS RTL, vous pouvez remplacer la direction en modifiant la direction float :.stLeft{ float: left; }
Répétez cette étape pour n'importe quelle classe indiquant la direction. Vous pouvez effectuer cette étape via un fichier CSS RTL ou vous pouvez créer des fichiers individuels portant des noms correspondant aux fichiers que vous remplacez..stLeft{ float: right; }Remarque : La plupart des fichiers CSS de menu contextuel disposent déjà de versions RTL. - Copiez /css/master.css dans /css/masterRTL.css et ajoutez des importations pour votre nouveau fichier ou vos nouveaux fichiers à la fin du fichier.
-
Ajoutez la chaîne suivante à /contributions/theme.json :
{ "value":"/css/masterRTL.css", "type":"rtl" }