This topic to show you how to translate your website and show it in Arabic. Arabic and some other languages like Persian and Hebrew are displayed from Right to Left.
1)-go to your admin center, click on Class Editor, select the class Header, then replace all the code before the line that says:
|
Code: HTML
<title>< !--CLASS::Meta_Title--></title>
|
with this code:
|
Code: HTML
<HTML dir="rtl" lang="ar">
<html>
<head>
<meta http-equiv="Content-Language" content="ar-eg">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
<title>< !--CLASS::Meta_Title--></title>
|
See the attached image below in this topic.
as you see the first line has lang="ar" which means Arabic general, the line that has
content="ar-eg" means arabic egypt, you can change this to your country arabic language code
for example for saudi arabia it would be ar-sa instead of ar-eg etc.
the line that has charset=windows-1256 this is windows arabic code page.
This will force all the browsers to automatically display any Arabic in your pages in the correct Arabic shap.
Now for the display from the Right to Left for the Arabic, go to the admin center, click on Language Manger,
under the Edit Language select the file "General / Homepage" then click the button "Edit" search on this
page for the variable named:
language_direction
You will find it set to ltr (which means left to right):
dir="ltr"
Change it to rtl (which means right to left):
dir="rtl"
That's all you need.
Of course you may need to internally in your html code use the tag dir="rtl" to display specific table div or pragraph etc.
Of course these information is helpful in other languages also like Spanish, etc.
For the top navigation to be from right to left, The top navigation class in the class editor, change things that say float:left to float:right, so the top navigation class should be like this:
|
Code: HTML
<style type="text/css">
.mainmenu{
position: relative;
padding: 0 0 0 0;
margin: 0 0 0 0;
background: url('<!--CLASS::Theme_Images_URL-->/menup_bg.gif') repeat-x; /*tab background image path*/
height: 46px;
list-style: none;
}
.mainmenu ul{
float: right;
width: 100%; /*width of menu*/
border: 1px solid #564c66; /*dark purple border*/
}
.mainmenu li{
float: right;
}
.mainmenu li a{
float: left;
display: block;
color:#000000;
text-decoration: none;
font-size: 12px;
font-weight: bold;
font-family: sans-serif;
padding: 0 0 0 16px; /*Padding to accomodate left tab image. Do not change*/
height: 46px;
line-height: 46px;
text-align: center;
cursor: pointer;
}
.mainmenu li a b{
font-size: 12px;
font-weight: bold;
font-family: sans-serif;
float: left;
display: block;
padding: 0 16px 0 0px; /*Padding of menu items 0 24px 0 8px*/
}
.mainmenu li.current a, .mainmenu li a:hover{
font-size: 12px;
font-weight: bold;
font-family: sans-serif;
color: #ffffff;
background: url('<!--CLASS::Theme_Images_URL-->/menup_hover_left.gif') no-repeat; /*left tab image path*/
background-position: left;
text-decoration: underline;
}
.mainmenu li.current a b, .mainmenu li a:hover b{
font-size: 12px;
font-weight: bold;
font-family: sans-serif;
color: #ffffff;
background: url('<!--CLASS::Theme_Images_URL-->/menup_hover_right.gif') no-repeat right top; /*right tab image path*/
}
</style>
|
Thank you
|
