Localizing the UI (For RTL languages)
Permalink 1 user found helpful
The main problems I'm facing are:
1. Blocks (or divs) positioned absolutely. It's really better and easier to build layouts with floats.
2. Inline styles instead of classes that prevents me from applying a different style.
3. Implicit use of images as img and sometimes as background, and styles used to set the background position.
4. Finally, some parts need a class for more control over the look and position of them.
Maybe a code review is needed to clean up these things.
Attached is a screenshot of the RTL UI.
1. Blocks (or divs) positioned absolutely. It's really better and easier to build layouts with floats.
2. Inline styles instead of classes that prevents me from applying a different style.
3. Implicit use of images as img and sometimes as background, and styles used to set the background position.
4. Finally, some parts need a class for more control over the look and position of them.
Maybe a code review is needed to clean up these things.
Attached is a screenshot of the RTL UI.
Why do we have to set the name of the language we want to use manually in the config/site.php and not make it (and other options, like advanced permissions) as variables that can be set from the Dashboard? This way it's much easier to use multiple stylesheets and language files at the same time without having to do this manually or provide a separate build.
What I mean is, e.g., for Arabic, I need to have modified .css files to:
1. Set the direction and text alignment
2. Set the font faces that are suitable for Arabic
3. Change the images and backgrounds to suit the direction
4. ... etc
These can (maybe) be packaged as a language pack for front-end/Dashboard and once installed will create the needed /language/xx_XX directory and its contents and copy the language support files to the correct place.
Once installed, the user will have an option in the Dashboard->Settings to set the language. Voila!
The project is using gettext, which is IMO the best way to provide multi-lingual capabilities, and this is a suggestion that might make it easy for users to have the full support for their language.
Please tell me if you need to discuss it further on IRC or here.
EDIT:
=====
Regarding the styles, there is one at least in Dashboard -> Users and Groups -> Export to Excel, line 217:
the in-line style here prevents the .css from aligning the image to the left because of the "float: right" in addition to limiting the style control. It should be move to a class in the .css file instead. (See the attached)
The same thing is used in the View Responses of the Reports->Form Results page, line 157:
Another occurrence is the 'Sign in or create account' form of the Add Funcionality page:
which again results in a bad display. (form.png attached).
This, and maybe, other in-line css styles need to be fixed, to make it even easier to create other themes for the Dashboard.
What I mean is, e.g., for Arabic, I need to have modified .css files to:
1. Set the direction and text alignment
2. Set the font faces that are suitable for Arabic
3. Change the images and backgrounds to suit the direction
4. ... etc
These can (maybe) be packaged as a language pack for front-end/Dashboard and once installed will create the needed /language/xx_XX directory and its contents and copy the language support files to the correct place.
Once installed, the user will have an option in the Dashboard->Settings to set the language. Voila!
The project is using gettext, which is IMO the best way to provide multi-lingual capabilities, and this is a suggestion that might make it easy for users to have the full support for their language.
Please tell me if you need to discuss it further on IRC or here.
EDIT:
=====
Regarding the styles, there is one at least in Dashboard -> Users and Groups -> Export to Excel, line 217:
<a href="?output=excel&" style="float: right; line-height: 18px; padding-left: 20px; background: transparent url(/concrete/concrete/images/icons/excel.png) no-repeat">Export to Excel</a>
the in-line style here prevents the .css from aligning the image to the left because of the "float: right" in addition to limiting the style control. It should be move to a class in the .css file instead. (See the attached)
The same thing is used in the View Responses of the Reports->Form Results page, line 157:
<div style="float:right; margin-bottom:8px">
Another occurrence is the 'Sign in or create account' form of the Add Funcionality page:
<div id="loginFormRight" style="width: 33%; text-align: right; float: right; margin-right: 20px; height: auto; margin-top: 80px;"> <div style="font-size: inherit; line-height: inherit; text-align: left; margin-bottom: 8px;"> Don't have an account on <br>the concrete5 marketplace? </div>
which again results in a bad display. (form.png attached).
This, and maybe, other in-line css styles need to be fixed, to make it even easier to create other themes for the Dashboard.
Yep.
So I came up with the solution to set the default language to be Japanese. And changed some CSS to Japanese fonts.
And we've been packaging each build as Andrew mentioned.
I agree Okhayat to certain extent... But there are a lot of another concern why you should build your own package sometime.
So I came up with the solution to set the default language to be Japanese. And changed some CSS to Japanese fonts.
And we've been packaging each build as Andrew mentioned.
I agree Okhayat to certain extent... But there are a lot of another concern why you should build your own package sometime.
Can you please list these concerns?
Actually, the main reason I used, and liked Joomla, for all this time is the ease of installing and using multiple languages at the same time and switching between them.
An additional attribute that made it easy for me to decide what .css to use, it the language->direction or isRTL. They will help me decide what layout to use and create common .css files for RTL languages (Arabic, Urdu, Hebrew ...etc)
I'm only talking about the interface language here, and not the content ofcourse.
Actually, the main reason I used, and liked Joomla, for all this time is the ease of installing and using multiple languages at the same time and switching between them.
An additional attribute that made it easy for me to decide what .css to use, it the language->direction or isRTL. They will help me decide what layout to use and create common .css files for RTL languages (Arabic, Urdu, Hebrew ...etc)
I'm only talking about the interface language here, and not the content ofcourse.
... for the post
Showing the right-floated export button
I am using Joomla exactly for the reasons you said above, I develop web sites in Hebrew, and I would love to switch to C5.
Could you share the build you have done so I can work on it as well?
Thanks
Maurice
Could you share the build you have done so I can work on it as well?
Thanks
Maurice
would you mind send css files for RTL dashboard to me or my email or attach here?
Hi,
Can you also send me the css files and any other changes you made to make concrete5 work in rtl languages?
With your permission i would want to create a guide based on your code on how to make concrete5 work with rtl languages.
Thanks,
Robi
Can you also send me the css files and any other changes you made to make concrete5 work in rtl languages?
With your permission i would want to create a guide based on your code on how to make concrete5 work with rtl languages.
Thanks,
Robi
I want to make sure that we accommodate these needs as much as possible in the core, of course - so if you could send me information or post here regarding what classes you'd like to see added to elements, and perhaps what stylings we could do to make this easier (provided they work in Firefox, IE 7+, Safari, Chrome, all those browsers...)
Just thinking out loud.