Important information : date of posts and versions

This multilingual site is born around 3 years ago (WP 3.0). Since lot of improvements in WP Core and versions of xili-language plugin…

Example twentyten-xili is downloadable now in version 3.0 and uses recent technic (classes and more…). He is also compatible 3.5+. Technical infos are here on website showing twentythirteen-xili.

Here posts and how to are are left in place as learning.

So remember to read the date of the article and the versions !!

M.

Posted in News | Leave a comment

What is a child theme ? Example here for multilingual website

This post to introduce a new series of posts to explain how with few modifications and the way of child theme of twentyten theme containing just modified files, it possible to create a multilingual website. Here, the child theme is named twentyten-xili and his parent is default shipped twentyten.
In functions.php file of child theme some functions where added to improve multilingual features delivered by xili-language plugin. The child style.css is very short and contains just the lines to format languages menu automatically added to header menu and for widget added in sidebar.
Next post : the child theme content… and the advantage of this approach.

Posted in News | Tagged , , , | 2 Comments

This site is powered by xili-language v. 2.5.0 – [updated to 2.7.0]

This site is now powered with latest release – 2.5.0 – of xili-language. His new user interface facilitates the job of multilingual authors. See a presentation in the new xili-wiki.

New UI to edit post : language dashboard

New UI to edit post : language dashboard

Posted in News | Leave a comment

xili-language v. 2.1 released…

Available in WP plugin’s repository (Other Versions)

What’ new in this release ?

  • new type of navigation added in xili_language_list for template, widget and navigation menu
  • to automatic insertion of languages list possible to choose location if the theme contains more than one
  • some fixes

What about new type of navigation ?

Before, you need to use a special template tag to create a link to other posts in other languages or you need to be a php user to add a hook to the xili-language function of xili_language_list. Now by adding new type, you can change to it and the language list now link to home, category and single in other languages.

Nav Menu Updated

Nav Menu Updated

What about this new release and the twentyten child example ?

You must use to update the theme with version 1.3 of twentyten-xili.
If using xili-language settings, you update the set of automatic menu, the theme don’t display the flags under title when single post is shown because when now when clicking to flag in nav menu, the link go to post in another language.

Languages navigation before

Languages navigation before


From single to single with new settings

From single to single with new settings

Webmasters with wp and php knowledges are invited to read the functions.php and multilingual-functions.php : inside some examples how to “hook” plugin’s functions.

Posted in News | Tagged , , , , | 1 Comment

Episode #6 – Child theme, Multilingual website: Questions in bulk…

In the previous episodes, we have seen the essential elements to build a multilingual website based on xili-language trilogy and a child theme of the default twentyten theme delivered by WP team.

Now, a little break for questions and answers:

Q: What are the modifications inside the files of the child against the parent ? Why ?

A:File by file for php developers with minimal knowledge in WP architecture !

  • category.php : the title and description before the list of excerpts in loop:
    twentyten

    <h1 class="page-title"><?php
    					printf( __( 'Category Archives: %s', 'twentyten' ), '<span>' . single_cat_title( '', false ) . '</span>' );
    				?></h1>
    				<?php
    					$category_description = category_description();
    					if ( ! empty( $category_description ) )
    						echo '<div class="archive-meta">' . $category_description . '</div>';

    twentyten-xili

    <h1 class="page-title"><?php
    					printf( __( 'Category: %s', 'twentyten' ), '<span>' . single_cat_title( '', false ) . '</span>' );
    				?></h1>
    				<?php
    					$category_description = trim(strip_tags(category_description()));
    					if ( ! empty( $category_description ) )
    						echo '<div class="archive-meta"><p>' . __($category_description,'twentyten') . '</p></div>';
  • page.php and single.php : insertion of xiliml_the_other_posts template tag just under the title
    twentyten-xili

    <div class="entry-meta">
    						<?php xiliml_the_other_posts($post->ID,"Read this post in"); ?>
    					</div><!-- .entry-meta -->

    and add a class for rtl languages :

    post_class(single_lang_dir($post->ID))

    (call a function added in functions.php)

  • functions.php
    contains minimal functions to not use languages files of parent theme, call a library to display flags in menu and side menu and to add languages in search..

Q: In WPLANG, some languages are not with 5 chars but with 2 chars like in japanese install kit, how to ?

A: Before version 1.8.8, it was necessary to change wp-config.php like japanese and set WPLANG to ISO : from ja to ja_JA and rename the ja.mo to ja_JA.mo inside languages sub-folder of current theme. Now with 1.8.8, the trilogy is updated, it is not necessary. So very easy for a japanese to transform his site in a multilingual site by adding other language files as here for test.

japanese welcome example

japanese welcome example

Q: What about xili-language and texts inside plugins ?
A: With innumerable crowd of plugins (and widgets), it is perhaps possible to define

  1. mono language plugin: not ready for localization
  2. plugin ready for localization (with .pot file and .po series) – perhaps ready for multilingual in visitor’s side if no datas set by enduser
  3. plugin ready for localization AND live multilingual – providing api or way to switch datas language

If a widget is well designed, his title is translatable.
For labels or terms, if localizable, xili-language is able (if checked) to switch live the domain of the plugin to the domain of the theme (only in user side – not admin)… So just need to add term (and translation) via xili-dictionary to .po and .mo…

Q: What about WP 3.1 next release now in beta testing ?

A: In localhost here, all the tests done with WP 3.1beta (mono and multisite mode) show the compatibility with multilingual xili-language trilogy plugins.

Q: What about multisite or WP 3.x network mode ?

A: As implemented here, xili-language is compatible with multisite mode. For support and services, order a quotation.

Q: What about Quick Edit for language in posts list ?

A: Yes, the hooks were found for little source add on… available since 1.8.9 soon !!!

quick-edit: pop-up to choose language in posts list

quick-edit: pop-up to choose language in posts list

Now very easy to modify a posts list in dashboard !

Posted in How to | Tagged , , , , | Leave a comment

Episode #5 – Step of widget and tips and tricks

Following the previous episodes, now, while navigating in the website, most of the elements in theme change of language according language of the single post or the sub-selection of language if language widget is added in sidebar.

Before to go, a little recall: here the purpose is about default twentyten theme and a child named twentyten-xili. It is easy to transpose in the context of another well-design theme with localization / internationalization features (no items hardcoded, gettext function called).

Widgets

The results depend of the quality of how they ared coded. If they are coded like extends of class Widget, no problem for the title :

widget’s title

When you create, don’t forget two things :
1) create the title in english (like root language of twentyten theme and WP),
2) add the title and his translations in .mo file via xili-dictionary (or via poEdit and .po).

widget’ content

The content totally depends of the purpose of the widget. If it uses labels, hope that gettext functions are used. Good, but currently, if so, the translation domain for the visitor’s side is the domain of the plugin linked to the admin’s side as currently in localizable website…
By checking line in fieldset – Translation domains settings – in xili-language >= version 1.8.7, the plugin changes that for visitor’s side and search translations inside terms defined in .mo of theme. So you must add target terms (and translation) with xili-dictionary…

xili-language widgets

xili-language includes three widgets ( List of languages, List of recent posts, Recent Comments list).
List of languages displays list of languages in sidebar.
In the exemple below, using some features delivered in library joined in twentyten-xili child theme, it is possible to display the list only when a category is shown and display the list of the same category but in other languages.
Because xili-language is hookable and fully customizable, webmasters/developers can design behaviour adapted to website, theme and special needs of navigation.
xili-language widget

Formatted print (printf, sprintf)

Sometime, you will try to find how to translate a displayed “Protected”. But the result remain unchanged. It is because WP or a plugin use a formatted print where a var in include… In the example below (extract of .po file), %s is the title of a post… So don’t forget to include at the right place the %s in the target language. (When adding a term for translation, a button “Write original text” helps you to translate keeping special formatting chars.)

msgid "Private: %s"
msgstr "%s (accès privé)"
 
msgid "Protected: %s"
msgstr "%s (protégé)"

These translations work in WP php code like here :

$protected_title_format = apply_filters('protected_title_format', __('Protected: %s'));

style.css

In the style.css file displayed here, some comments how to add your own flags for other languages not yet included…

@charset "UTF-8";
 
/**
 * Theme Name: Twentyten-xili Multilingual Child
 * Theme URI: http://dev.xiligroup.com/
 * Description: Twentyten based but including features for multilingual context with xili-language plugin
 * Author: dev.xiligroup.com ms
 * Author URI: http://dev.xiligroup.com/
 * Version: 0.9
 * Tags: child theme, tabs, multilingual
 * Template: twentyten
 */
 
@import url('../twentyten/style.css'); /* the most important line of the style.css of a child from his parent twentyten */
 
 
/*** below : modification to add style for language list widget and language list automatically added in header menu ***/
 
/* some few modifications for xili-language list */
ul.xililanguagelist {list-style: none !important ; margin-left:0 !important ;}
 
/* example in header menu if filter xiliml_infunc_language_list is on - complete the list for the other languages used in the website */
 
ul.menu li.lang-fr_fr a {background: transparent url('images/flags/fr_fr.png') no-repeat center 13px;}
ul.menu li.lang-en_us a {background: transparent url('images/flags/en_us.png') no-repeat center 13px;}
ul.menu li.lang-de_de a {background: transparent url('images/flags/de_de.png') no-repeat center 13px;}
ul.menu li.lang-es_es a {background: transparent url('images/flags/es_es.png') no-repeat center 13px;}
 
li.lang-fr_fr:hover > a {background:  #333 url('images/flags/fr_fr.png') no-repeat center 13px !important;}
li.lang-en_us:hover > a {background:  #333 url('images/flags/en_us.png') no-repeat center 13px !important;}
li.lang-de_de:hover > a {background:  #333 url('images/flags/de_de.png') no-repeat center 13px !important;}
li.lang-es_es:hover > a {background:  #333 url('images/flags/es_es.png') no-repeat center 13px !important;}

ul.menu li.lang-fr_fr, ul.menu li.lang-en_us, ul.menu li.lang-de_de, ul.menu li.lang-es_es {text-indent:-9999px; width:18px;}
 
/** © dev.xiligroup.com 2010-1-20 **/

To add a language, add the flag in images/flags/ subfolder of the theme containing style.css. In style.css, duplicate one line in first group, change name -es_es by -it_it if italian is new target language. Again in second group and add ,ul.menu li.lang-it_it in last line before “{“.
The first group of lines shows the flag, the second change background to grey when mouse is hover and the long line “erase” the text by putting it outside visible screen.

Next step : FAQ

Posted in How to | Tagged , , , , , | 1 Comment