Arabic text in Kirby's panel is output confused

Hello,

I’m working on a multi-language website with English, Italian and Arabic texts. I set up the three languages like this in the config.php:

c::set('languages', array(
  array(
    'code'    => 'en',
    'name'    => 'English',
    'default' => true,
    'locale'  => 'en_US',
    'url'     => '/',
  ),
  array(
    'code'    => 'it',
    'name'    => 'Italian',
    'locale'  => 'it_IT',
    'url'     => '/it',
  ),
  array(
    'code'    => 'ar',
    'name'    => 'Arabic',
    'locale'  => 'ar_BH',
    'url'     => '/ar',
  ),
));

I can add Arabic text into the Panel and I’m calling it with <?php echo kirbytext($page->etc.->text()); ?>. Everything works fine for the English version, but switching to the Arabic, the text gets cumbersome like:

مع عشر حدائق الفاكهة المميزة، والتي تحتوي على الأشجار التي سيكون المثمرة في لحظات مختلفة طوال مدة ستة أشهر من المعرض، ام

In the source-code, the text above is actually in the paragraph-tag, so it’s not a mistake due to the font (I’m using a font, supporting arabic characters). My html tag has lang=“ar” and I have meta charset=“utf-8” in the head.

Any advises on this?
Furthermore, is it possible to set the text for the Arabic panel to the reading direction right-to-left?

Thanks a lot!

EDIT: checking the page.ar.txt file, the text here is in arabic characters.

For right-to-left check the fresh Kirby 2.1 beta:
http://forum.getkirby.com/t/kirby-2-1-beta-is-here/660

Okay, thanks, this looks promising for the Panel’s side. So basically Arabic texts seem to be supported. Any suggestions on why I get this wrong text output on my website?

Would it be possible to get a zipped version of your project? I have to take a closer look at it. Since Kirby supports UTF-8 out of the box, I’m not entirely sure what’s wrong here. Just send it to support@getkirby.com

Thanks for the offer. I found the solution and it was more a matter of my provider. It seems the php didn’t support the UTF-8 right away.

I added a php.ini file to the root of my domain, saying:

default_charset = "UTF-8"

Arabic works now. Considering the Panel, I could really use the feature to change its reading direction to Right-to-Left. I’m aware, it’s a Beta, but is it possible to upgrade to 2.1 and still use all my content-, template-, snippet- and config-files?

yes, absolutely! the upgrade is seemless. The version is also very stable. I just wanted to run the beta to make sure we didn’t miss any bugs.

It would also be great to hear your thoughts on the RTL implementation. As both of us, who worked on the version, are used to LTR text it might have happened that we missed something.

Yes, I’ll let you know. One question, I added the new ‘direction’ => ‘ltr’ and ‘direction’ => ‘rtl’ to my config.php, but switching to Arabic in my Panel, the reading direction is still left-to-right. Is there something more, to use the rtl in the Panel?

Could you share your config file. Just tested it and it works for me with this:

c::set('languages', array(
  array(
    'name'      => 'English',
    'code'      => 'en',
    'locale'    => 'en_US.utf-8',
    'default'   => true,
    'url'       => '/',
    'direction' => 'ltr'
  ),
  array(
    'name'      => 'العربية',
    'code'      => 'ar',
    'locale'    => 'ar_AE.utf-8',
    'url'       => '/ar',
    'direction' => 'rtl'
  )
));

Here the language part of my config.php:

c::set('languages', array(
	  array(
	    'code'    => 'en',
	    'name'    => 'English',
	    'default' => true,
	    'locale'  => 'en_US.utf-8',
	    'url'     => '/',
	    'direction' => 'ltr'
	  ),
	  array(
	    'code'    => 'it',
	    'name'    => 'Italian',
	    'locale'  => 'it_IT.utf-8',
	    'url'     => '/it',
	    'direction' => 'ltr'
	  ),
	  array(
	    'code'    => 'ar',
	    'name'    => 'العربية',
	    'locale'  => 'ar_BH.utf-8',
	    'url'     => '/ar',
	    'direction' => 'rtl'
	  ),
	));

Here a screenshot of my panel, when I switch to Arabic language. The text inside the textarea should be running rtl, right?

Thanks!

Ahhh I think I might got what’s wrong: Did you actually switch the language to Arabic in your user settings in the Panel? (Click on the menu item top left corner > Users > edit your user)… Cause at the moment, you only switched to editing your Arabic version of your pages, but still running the panel in English.

Ok, that’s it. I thought it would be possible to switch the layout only for the specific language, but it works fine like that aswell.

Another question, kind of off this topic, but language-related. I have a checkbox-field on one page, which will output a list of all checked fields in my template. Depending on the selected language, I would like to translate the values of these checkboxes. Can I insert variables in the blueprint and give translations for these or similar?

Here my blueprint:

fields:
  title:
    label: Title
    type:  text
  headertitle:
    label: Header Title
    type:  textarea
  blooming:
  	label: Currently Blooming
  	type: checkboxes
  	options:
  		Musa Basjoo: Musa Basjoo
  		Ficus Carica: Ficus Carica
  		Ziziphus Jujuba: Ziziphus Jujuba
  		Opentia Ficus Indica: Opentia Ficus Indica
  		Phoenix Dactylifera: Phoenix Dactylifera
  		Punica Granatum: Punica Granatum
  		Citrus X Limon: Citrus X Limon
  		Citrus Medica: Citrus Medica
  		Citrus Sinensis: Citrus Sinensis
  		Citrus Aurantium: Citrus Aurantium
  		Olea Europaea: Olea Europaea
  		Carica Papaya: Carica Papaya
  		Vitis Vinifera: Vitis Vinifera

EDIT: Can I set up the checkboxes, so they change in all languages, if they are changed in one language?

It works with e.g.:

    options:
      Musa Basjoo:
        en: Musa Basjoo
        de: Klara
      Ficus Carica:
        en: Ficus Carica
        de: Herzog

But it only changes based on the language setting for the user, not which translation you are editing at the moment… at least I didn’t get it to work this way. And I assume that is actually what you are looking for :confused:

In addition to @distantnative:

If you want get language specific translations for the values, you can define translations in your language files in site/languages, e.g. in en.php

<?php

return array(
  'corporate-design' => 'Corporate design',
  'illustration' => 'Illustration',
  'photography' => 'Photography',
  ...
);

In your template, instead of outputting $page->categorydirectly, you could then do it like this:

<?php echo l($page->category()->toString()); ?>
1 Like

But this would change the language, that’s output in the template, right?

No, as I said, my thing only provides the translations for different panel languages. For templates (front end) you would need to try the solution @texnixe posted.

Okay, thanks. I don’t mind, if the Panel’s translation stays one language, I just need the output in the template to be translated, but I did not really get the solution @texnixe posted.

My blueprint-field still looks like this:

blooming:
  	label: Currently Blooming
  	type: checkboxes
  	options:
  		Musa Basjoo: Musa Basjoo
  		Ficus Carica: Ficus Carica
  		Ziziphus Jujuba: Ziziphus Jujuba
  		Opentia Ficus Indica: Opentia Ficus Indica
  		Phoenix Dactylifera: Phoenix Dactylifera
  		Punica Granatum: Punica Granatum
  		...

And I’m calling this list of options in my template like this:

<?php $blooms = $pages->find("pavilion")->blooming(); ?>
...
<?php foreach($blooms->split() as $bloom) : ?>
    <li><a href="<?php echo '#'.$bloomlink; ?>"><?php echo $bloom; ?></a></li>
<?php endforeach; ?>
...

How do I assign translations to the values in my translation .php’s?
Thanks!

Read again @texnixe’s post: You first have to define all those strings for each language, you wanna use, in the respective files in site/languages. The keys are the words you define in your blueprint in the options section on the left side of the colon.

In your template, you could then use something like:

…
<li><a href="…"><?php echo l($bloom->toString()); ?></a></li>
…

The l()method is used to get the right string from the language files, depending on the current language of the page visitor.

Hi, thanks, but I didn’t get it working right so far. Here my en.php in the language folder:

//Language strings
return array(
  'Musa Basjoo' => 'Musa Basjoo',
  'Ficus Carica' => 'Ficus Carica',
  'Ziziphus Jujuba' => 'Ziziphus Jujuba',
  'Opentia Ficus Indica' => 'Opentia Ficus Indica',
  'Phoenix Dactylifera' => 'Phoenix Dactylifera',
  'Ziziphus Jujuba' => 'Ziziphus Jujuba',
  'Punica Granatum' => 'Punica Granatum',
  'Citrus X Limon' => 'Citrus X Limon',
  'Citrus Medica' => 'Citrus Medica',
  'Citrus Sinensis' => 'Citrus Sinensis',
  'Citrus Aurantium' => 'Citrus Aurantium',
  'Olea Europaea' => 'Olea Europaea',
  'Carica Papaya' => 'Carica Papaya',
  'Vitis Vinifera' => 'Vitis Vinifera'
);

I’m calling this in my template like mentioned here, but with toString():

<?php echo l($bloom->toString()); ?>

On my website I get this error message:
FATAL ERROR: CALL TO A MEMBER FUNCTION TOSTRING() ON STRING IN /MNT/WEB5/D1/87/52146187/HTDOCS/BAHRAIN/SITE/SNIPPETS/TITLE.PHP ON LINE 15

What code creates $bloom in this version?