News feeds and titles in arabic which need right justification using CSS

Posted by haisam on February 2, 2005 at 2:52pm

I have successfully deployed a bi-lingual webpage, english and arabic. Much of it looks fine; however i want the arabic titles and newsfeed content to be right justified. Is there a way in CSS to determine the language being used and set the justificiation accordingly? Of course, I'm using UTF-8.

Comments

I forgot to include the webpage

Posted by haisam on February 2, 2005 at 2:59pm

This is the webpage in question http://www.arabiclinux.com/

PHPTemplate

Posted by Steven on February 2, 2005 at 4:42pm

As you're using PHPTemplate, I suppose you could do something like this in your node.tpl.php:

<?php
 $arabic = preg_match('/[\x{600}-\x{6FF}]/u', $content)); 
?>

Then replace
<div class="node">
with:
<div class="node" dir="<?php print $arabic ? "rtl" : "ltr"; ?>">

For the aggregator you'd have to do something similar by overriding theme_aggregator_page_item. See the PHPTemplate documentation for more information.

--
If you have a problem, please search before posting a question.

thanks, but ...

Posted by haisam on February 5, 2005 at 1:29am

Should'nt drupal do this by default?

Alignment vs directionality

Posted by Steven on February 5, 2005 at 3:27am

Firstly, mixing languages with different directions is a tricky issue regardless. The Unicode (bi)directionality algorithm affects only ordering and positioning of letters inside a string and does not deal with layout and alignment globally. Typical monolingual Arabic sites would simply have <html dir="rtl"> in their theme, which would descend down the HTML and set appropriate default alignments in all popular browsers (note that this is simply because most browsers have smart defaults... setting text-align: left; for example would put both ltr and rtl text left aligned).

The only thing that belongs in Drupal would be perhaps allowing you to specify the language of a piece of content. Then, this could be specified as lang="ar" and/or added as a CSS class. Though HTML explicitly says that lang should not control text directionality, they don't specifically mention text alignment.

Though the 'proper' solution is still to use dir="rtl" in the HTML content. In any case, this really belongs in i18n/internationalization module rather than Drupal core. Scanning specifically for Arabic characters is not a good idea as the majority of sites are not in Arabic script. Language-specific hacks are usually a bad idea.

The best place for this seems to be i18n module, which deals with mixed-language sites (though I think it's more intended as having a site with the same content in different languages, rather than just random content is different languages, visible to all). Still, I can't think of a way to do this globally without say making a parser which scans for HTML tags containing arabic and which adds dir="rtl" to each of them.

It could also be implemented as a nodeapi module (which would add <span dir="rtl"></span> to node titles and <div dir="rtl"></div> to the node body), but again this would only affect nodes, not the rest.

--
If you have a problem, please search before posting a question.

Some thoughts

Posted by kbahey on February 5, 2005 at 2:41am

Haisam.

A long time ago, I put some thoughts on how to Arabic Drupal, and one of the options was a CSS only solution using dir=

Here it is http://drupal.org/node/view/3696

You may also want to contact LinuxEgypt.org and EGLUG.org for an exchange of ideas on Drupal and Arabic.

--
Drupal performance tuning, development, customization and consulting: 2bits.com, Inc.
Personal blog: Baheyeldin.com.

There is this module: bidi.module

Posted by haisam on February 10, 2005 at 6:10pm

There is the bidi.module (http://drupal.org/node/13829). Would that work?

Doing this in a seperate

Posted by carlmcdade on February 5, 2005 at 7:51am

Doing this in a seperate style sheet is the way to go. After some reading here:
http://www.w3.org/TR/2003/CR-css3-text-20030514/

I finally got a chinese dinner menu on a English site correct and easily editable. You have to be careful of the mirror effect and getting the overflow of text wrong.
---------------------------
www.hivemindz.com (running PHP5)
www.fireorb.org (documentation and hacks)
__________________________
Carl McDade
Information Technology Consult
Team Macromedia

Drupal Web Developer - Stockholm Sweden
Drupal Sweden

suggesting a solution for arabic language

Posted by bassem on March 14, 2005 at 5:08pm

well i was trying something out to deal with arabic alignement, and i tested something that worked, but i'm still testing if it has any problems

i added a column to the node table, which has a 2 chracter length, and in it i set the language of the node, and then through CSS depending on the langugage in the node, the alignment is set.

i didn't use the internatinalization module because it's still messed up, and doesn't work properly.

cheers,

any success

Posted by abqaria on July 31, 2006 at 1:34pm

did anyone succeeded in the arabic direction thing ?

http://www.i-bloggers.com

http://www.WOGOOH.com
http://www.i-bloggers.com

bidi.module

Posted by gharbeia on September 4, 2006 at 8:15am

There is a bidi.module in Alaa's sandbox. It is a fliter that takes care of text direction.

Amr Gharbeia
http://gharbeia.net

Amr Gharbeia

how does it work

Posted by abqaria on September 5, 2006 at 2:33pm

how does it work
i mean i installed it , and still have no difference

http://www.i-bloggers.com

http://www.WOGOOH.com
http://www.i-bloggers.com

Just like a filter

Posted by gharbeia on September 19, 2006 at 9:58am

You will need to configure it like any other filter: admin>filter. It is good if you at least add it to your default input format. Click "configure" next to the input format name, then enable the bidi filter.

You can also import an Arabisation I have done, so users in Arabic will get a notification that text direction is taken care of.

Amr Gharbeia
http://gharbeia.net

Amr Gharbeia