emad
|
To make your Artisteer template works with RTL languages, and exactly with Joomfish component do the following :
Create new file next to your template.css file, and name it : template_rtl.css
Copy this code to this file :
body
{
direction: rtl;
}
.artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover
{
text-align: right;
}
.artmenu li
{
float: right;
}
.
.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
{
text-align: right;
}
.PostHeaderIcon-wrapper
{
text-align:right;
}
.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
text-align: right;
}
.PostHeader a:link
{
text-align: right;
}
.PostHeader a:visited, .PostHeader a.visited
{
text-align: right;
}
.PostHeader a:hover, .PostHeader a.hovered
{
text-align: right;
}
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
text-align: right;
}
h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
text-align: right;
}
h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
text-align: right;
}
h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
text-align: right;
}
h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
text-align: right;
}
h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
text-align: right;
}
blockquote p
{
text-align: right;
}
.Button .btn .t
{
text-align: right;
}
table.moduletable th, legend
{
text-align: right;
}
.contentpaneopen_edit
{
float: right;
}
form#form-login
{
text-align: right;
}
form#com-form-login
{
text-align: right;
}
table.paramlist td.paramlist_key
{
text-align: right;
}
.pollstableborder td
{
text-align: right;
}
#syndicate
{
float: right;
}
then go to your index.php inside your template and after this code:
<link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template.css" />
ADD THE FOLLOWING :
<?php if($this->direction == 'rtl') : ?>
<link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template_rtl.css" />
<?php endif; ?>
that's it.
Now if you change your Joomla language the template will be RTL as you expect.
and I hop from the above, Artisteer Developer can do it automatically by adding extra file template_rtl.css which is only will have some code as mentioned up.
Thanks & Regards
for more info
emadjumaah@gmail.com
|
| |
Sadeq
|
This will really get every thing done except the horizental menu. It will not show in IE. Is there a fix for that?
Thanks for you cooperation
|
| |
emad
|
There is one dot extra in the file and also I add some change, sorry ..
What you do now is to
1. remove the . (dot) in the 15th line
2. add the following code to the template_rtl.css file
Quote :.artmenu ul ul a { margin-right: auto; }
Quote :.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span { float: right; font-weight: bold; }
Please try it and give a feedback ..
Thanks
Emad
|
| |
emad
|
I made a mistake adding Quote instead of Code Icon
here is the final
What you do now is to
1. remove the . (dot) in the 15th line
2. add the following code to the template_rtl.css file
[code
].artmenu ul ul a
{ margin-right: auto; }
.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
{ float: right; font-weight: bold; }
Please try it and give a feedback ..
Thanks
Emad
|
| |
emad
|
.artmenu ul ul a { margin-right: auto; }
|
| |
emad
|
FINAL UPDATE FOR template_rtl.css FILE
body
{
direction: rtl;
}
.artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover
{
text-align: right;
}
.artmenu li
{
float: right;
}
.artmenu ul ul a
{
margin-right: auto;
}
.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
{
text-align: right;
float: right;
font-weight: bold;
}
.PostHeaderIcon-wrapper
{
text-align:right;
}
.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
text-align: right;
}
.PostHeader a:link
{
text-align: right;
}
.PostHeader a:visited, .PostHeader a.visited
{
text-align: right;
}
.PostHeader a:hover, .PostHeader a.hovered
{
text-align: right;
}
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
text-align: right;
}
h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
text-align: right;
}
h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
text-align: right;
}
h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
text-align: right;
}
h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
text-align: right;
}
h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
text-align: right;
}
blockquote p
{
text-align: right;
}
.Button .btn .t
{
text-align: right;
}
table.moduletable th, legend
{
text-align: right;
}
.contentpaneopen_edit
{
float: right;
}
form#form-login
{
text-align: right;
}
form#com-form-login
{
text-align: right;
}
table.paramlist td.paramlist_key
{
text-align: right;
}
.pollstableborder td
{
text-align: right;
}
#syndicate
{
float: right;
}
|
| |
Sadeq
|
Thanks for all of this Emad. I updated the file.
I solved the horizontal menu issue in IE by adding the following element to your file:
ul.artmenu {width: 100%;}
|
| |
Emad
|
Thank you for your feedback..
|
| |
FAIL
|
Hi Emad.
Nice try, but it does not work.
I think you are missing something conceptually here. It's not just a matter of forcing 'right' in every case. That depends on the template design. Things that are 'left' go 'right', but things that are 'right' go left' and things that are centered should be left as they are. Also some images need to be mirrored and some not. Add to this the fact that padding of image is used n some cases, and there you need to flip the padding.
It's a really complicated business to do this properly and it's much more than just adding a special CSS file.
Nice try though and I applaud your efforts.
|
| |
Emad
|
Hi Fail.
OK, you are right, for some special templates need more work.
but at least we have something to start with.
Thanks
Emad
|
| |
nethelper
|
تعبت يالربع ابي حل تكفون
www.iefpedia.com/arab/
i am very tiered every thing failed
|
| |
arman
|
Hi and tanx dear emad 4 ur helping
but what should i do 4 bullet !!? they should go to right
and also what should i do 4 to menu ?
regards 
|
| |
Farhad
|
This didn't work for me, nothing changed.
|
| |
majed
|
hi all is that work for wordpress ?
|
| |
Kamil
|
body
{
direction: rtl;
}
.artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover
{
text-align: right;
}
.artmenu li
{
float: right;
}
.artmenu ul ul a
{
margin-right: auto;
}
.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
{
text-align: right;
float: right;
font-weight: bold;
}
.PostHeaderIcon-wrapper
{
text-align:right;
}
.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
text-align: right;
}
.art-BlockContent-body ul li, .art-Post li, .art-header-tag-icon
{
background-position:right top;
padding: 0 15px;
}
.PostHeader a:link
{
text-align: right;
}
.PostHeader a:visited, .PostHeader a.visited
{
text-align: right;
}
.PostHeader a:hover, .PostHeader a.hovered
{
text-align: right;
}
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
text-align: right;
}
h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
text-align: right;
}
h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
text-align: right;
}
h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
text-align: right;
}
h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
text-align: right;
}
h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
text-align: right;
}
blockquote p
{
text-align: right;
}
.Button .btn .t
{
text-align: right;
}
table.moduletable th, legend
{
text-align: right;
}
.contentpaneopen_edit
{
float: right;
}
form#form-login
{
text-align: right;
}
form#com-form-login
{
text-align: right;
}
table.paramlist td.paramlist_key
{
text-align: right;
}
.pollstableborder td
{
text-align: right;
}
#syndicate
{
float: right;
}
|
| |
Avatar
|
Make another template and call it template_rtl.css as Emad mentioned above.
Add this code to the html right before the end of html tag
<?php if($this->direction == 'rtl') : ?>
<link href="<?php echo $this->baseurl ?>/templates/yourtemplatename/css/template_rtl.css" rel="stylesheet" type="text/css" />
<?php endif; ?
yourtemplatename= your template name 
Back to template_rtl.css
To make the text direction rtl:
body { direction: rtl; }
the body element is already there, just add the direction attribute
To make the horizontal menu rtl
Search in your code for :
.art-menu li
then change float:left to float:right
To make articles titles rtl (they don't change rtl with the other text) :
find: art-PostHeaderIcon-wrapper in your CSS (is located in two places mainly), change both text-align: left to right
|
| |
Avatar
|
Oh and of course this all depends on what template you created. so some things might not be exactly as mentioned above........I think so
|
| |
Yoram
|
Thanks everyone. All you've written has been very helpful to me!
|
| |
WebDeveloper
|
Quote مهدی هواسی پور:
Quote Yoram:
Thanks everyone. All you've written has been very helpful to me!
بنام خدای زیبا
شما که از طراحی و ایجاد قالب حرف میزنید نمی دانید اینگونه روش ها راه به جایی ندارد و جز ساده بودن و مبتدی بودن کار شما را می رساند
بیشتر دقت کنید
آقای مهدی ، لطفا به جای اینکه کسی رو نصیحت کنی و مبتدی خطابشون کنی برو وقت بزار رو طراحی وبلاگ خودت چون توی تمام مرورگرا غیر از اینترنت اکسپلورر به هم ریخته میاد
|
| |
priya
|
hi friends
my problem is with the sub-menu item thats open towards the right side, outside of the site,
somebody knows where can i change it?
this is my site
http://socsci.tau.ac.il/mainspirit/
thank you
priya
|
| |
filiplarlibe
|
Hello everyone,
Sorry for my English but I am french.
Priya, I have exactly the same problem as you. My horizontal menu does not display correctly, it appears completely to the right of the page with Internet Explorer but cons with other browsers it works very well.
How can we solve this problem with Internet Explorer? What should I change?
Thank you in advance.
|
| |
alirezasea
|
thank you so much for this solution but i have problem. all the header, include category and section header are still in wrong position at the left side.
could you please tell me what can i do?
Quote emad:
To make your Artisteer template works with RTL languages, and exactly with Joomfish component do the following :
Create new file next to your template.css file, and name it : template_rtl.css
Copy this code to this file :
body
{
direction: rtl;
}
.artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover
{
text-align: right;
}
.artmenu li
{
float: right;
}
.
.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
{
text-align: right;
}
.PostHeaderIcon-wrapper
{
text-align:right;
}
.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
text-align: right;
}
.PostHeader a:link
{
text-align: right;
}
.PostHeader a:visited, .PostHeader a.visited
{
text-align: right;
}
.PostHeader a:hover, .PostHeader a.hovered
{
text-align: right;
}
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
text-align: right;
}
h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
text-align: right;
}
h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
text-align: right;
}
h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
text-align: right;
}
h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
text-align: right;
}
h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
text-align: right;
}
blockquote p
{
text-align: right;
}
.Button .btn .t
{
text-align: right;
}
table.moduletable th, legend
{
text-align: right;
}
.contentpaneopen_edit
{
float: right;
}
form#form-login
{
text-align: right;
}
form#com-form-login
{
text-align: right;
}
table.paramlist td.paramlist_key
{
text-align: right;
}
.pollstableborder td
{
text-align: right;
}
#syndicate
{
float: right;
}
then go to your index.php inside your template and after this code:
<link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template.css" />
ADD THE FOLLOWING :
<?php if($this->direction == 'rtl') : ?>
<link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template_rtl.css" />
<?php endif; ?>
that's it.
Now if you change your Joomla language the template will be RTL as you expect.
and I hop from the above, Artisteer Developer can do it automatically by adding extra file template_rtl.css which is only will have some code as mentioned up.
Thanks & Regards
for more info
emadjumaah@gmail.com
|
| |
Marat
|
Any solution for drupal!
|
| |
is2host
|
what is solution of wordpress ?
|
| |
hasan
|
Hi!
How can I moved menu bullet from left to right in css using artisteer
|
| |
omar
|
for a RTL template , i ve used the formating facilities in artisteer , the y are all working very and i had every things working fine except of : the bullets listing in both the article content and the block content, any help please .
|
| |
Dragonarab
|
Quote hasan:
Hi!
How can I moved menu bullet from left to right in css using Artisteer
السلام عليكم
Brothers and sisters, I have found the solution for the bullets i spend most of my day time trying to fix this problem, and finally i found a solution for it.
I have copied my bullets CSS for you, try to find the difference and change it to yours, all I am asking is to pray for me and my parents for mercy and forgiveness.
Here you go.
/* begin PostBullets */
.art-post ol, .art-post ul
{
color: #141414;
margin: 1em 0 1em 2em;
padding: 0;
margin-right: 35px; /* I add that */
margin-left: 0; /* I add that */
text-align: right; /* I add that */
}
.art-post li ol, .art-post li ul
{
margin: 0.5em 0 0.5em 2em;
padding: 0;
}
.art-post li
{
margin: 0.2em 0;
padding: 0;
}
.art-post ul
{
list-style-type: none;
}
.art-post ol
{
list-style-position: inside;
}
.art-post li
{
padding: 0 0 0 26px;
line-height: 1.5em;
}
.art-post ol li, .art-post ul ol li
{
background: none;
padding-left: 0;/* overrides overflow for "ul li" and sets the default value */
overflow: visible;
}
.art-post ul li, .art-post ol ul li
{
background-image: url('images/postbullets.png');
background-repeat: no-repeat;
background-position:right; /* I added this one to change the background to the right */
padding-right: 26px;/* makes "ul li" not to align behind the image if they are in the same line */
overflow: auto;
}
/* end PostBullets */
lets hope Artisteer team can solve this issue in next release.
|
| |
reza
|
كاش ميشد كه تاپيك آقاي هواسي پور حذف بشه راستش مايه دق شده براي من ايشون همه جا از جمله سايت جومينا ادعاي استادي ميكنه و براي خرج كردن هنرش ناز ميكنه اگر مايل بودين تو يكي از تاپيك هاي سايت جومينا ناز كردن ايشونو بخونين البته بايد سرچ كنيد چون آدرسو سيو نكردم.اونجا يكي ميگه بگم آموزشو يكي ميگه نه طراحان بيكار ميشن.خلاصه تعارف الكي و ايشون هم اون وسط يه گنده مياد.راستش خندم گرفت از كار اينا.در ضمن رفتم به آدرسي كه تو امضائ هواسي پور بود و يه قالب دانلود كردم ايشون هم سي اس اس اصلي رو آرتي ال كرده بود و هم يه دونه سي اس اس آرتي ال الكي كنارش گذاشته بود اونجا به درجه استادي ايشون ايمان آوردم.آخه كوچولو درسته ما تو اين كار زياد وارد نيستيم ولي اينو متوجه هستيم كه اگه قرار باشه فقط از زبان فارسي استفاده كنيم همون فايل اصلي رو تغيير ميديم كافيه.
راستش حوصله ندارم راجب آدماي خود بزرگبين كوچك بحث كنم. فقط خدا نكند كه گدا معتبر شود گر شود اينجوري مثل بعضي ها شود كه البته معتبر هم نيستند از بيكاري اين ور و اون ور هي گنده در ميكنن.
|
| |
reza
|
راستي اگر خواستيد سايت حرفه اي ايشون رو كه در صورت افشائ راز آرتي ال كردن قالب هاي آرتيستر تعطيل ميشه ببينيد به آدرس زير مراجعه كنيد.
http://www.pouyaservice.com
|
| |
vika
|
Quote emad:
To make your Artisteer template works with RTL languages, and exactly with Joomfish component do the following :
Create new file next to your template.css file, and name it : template_rtl.css
Copy this code to this file :
body
{
direction: rtl;
}
.artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover
{
text-align: right;
}
.artmenu li
{
float: right;
}
.
.artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
{
text-align: right;
}
.PostHeaderIcon-wrapper
{
text-align:right;
}
.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
text-align: right;
}
.PostHeader a:link
{
text-align: right;
}
.PostHeader a:visited, .PostHeader a.visited
{
text-align: right;
}
.PostHeader a:hover, .PostHeader a.hovered
{
text-align: right;
}
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
text-align: right;
}
h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
text-align: right;
}
h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
text-align: right;
}
h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
text-align: right;
}
h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
text-align: right;
}
h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
text-align: right;
}
blockquote p
{
text-align: right;
}
.Button .btn .t
{
text-align: right;
}
table.moduletable th, legend
{
text-align: right;
}
.contentpaneopen_edit
{
float: right;
}
form#form-login
{
text-align: right;
}
form#com-form-login
{
text-align: right;
}
table.paramlist td.paramlist_key
{
text-align: right;
}
.pollstableborder td
{
text-align: right;
}
#syndicate
{
float: right;
}
then go to your index.php inside your template and after this code:
<link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template.css" />
ADD THE FOLLOWING :
<?php if($this->direction == 'rtl') : ?>
<link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template_rtl.css" />
<?php endif; ?>
that's it.
Now if you change your Joomla language the template will be RTL as you expect.
and I hop from the above, Artisteer Developer can do it automatically by adding extra file template_rtl.css which is only will have some code as mentioned up.
Thanks & Regards
for more info
emadjumaah@gmail.com
i am using the new version2.5 of artisteer to create templtaes and this solution doesn't work there, what can i do? (i tired templates on lower version and it's works great)
|
| |
|