Browser Tutorial Localization (en)¶

Browser Manual and Browser Tutorial Library¶

Manual: The Browser has it's own manual (with the reference of course).

• HTML http://typo3.org/documentation/document-library/extension- manuals/browser/current/
• PDF: http://typo3.org/extensions/repository/view/browser/current/info /?tx_terfe_pi1%5BdownloadFile%5D=doc%252Fmanual.pdf

Tutorial Library: Tutorial Library for the Browser with a lot of step- by-step introductions.

• HTML: http://typo3.org/documentation/document-library/extension- manuals/browser_tut_basics_en/current/
• PDF: http://typo3.org/extensions/repository/view/browser_tut_basics _en/current/info/?tx_terfe_pi1%5BdownloadFile%5D=doc%252Fmanual.pdf

TYPO3 Localization Guide¶

If you want to know more about TYPO3 localization, please read the official TYPO3 "Frontend Localization Guide":

http://typo3.org/documentation/document-library/core- documentation/doc_l10nguide/current/

TYPO3 Core API¶

The TYPO3 Core API has a lot of information in context with the localization and the TCA.

http://typo3.org/documentation/document-library/core- documentation/doc_core_api/current/

Translation¶

Translation means that a specific composition of words are translated to another language. In other words: If there is a header and an image in the default language, so there will be in the translation. No more, no less.

Localization¶

Localization means more broadly that a page is represented in another language. This of course means information in that language ("translation") but could also include alternative templates, additional composition of content directed to another audience etc. In other words: There might be another number of headers and images than in the default language.

Example tt_news¶

I.e. we are using the three languages

• English (default language),
• German and
• French

in our TYPO3 installation.

We have a news with this fields and values in the default language (English):

• title: New President
• image: barack_obama.jpg
• category: lead story

If we translate the news to German (adding a second record tt_news with the language id of the German language) the TCA will display:

• title: [Translate to German] New President
• category: Categories from the translation original of this record: lead story [12]

The image field won't be displayed - it isn't editable.

The category field will be displayed although like the example above, but it isn't editable neither.

Why are the field image and the field category not editable?

Image isn't editable, because we need the Barack Obama photo once only:

The president looks alike in English, German or French language.

We don't like to upload the same photo for every language. And we can't upload it, because the image field has the property l10n_mode = exclude in the TCA array. It won't be displayed, if the backend editor has choosen another language than the default language.

We have a similar case with the field category: We don't need another category for the news, we need only a translated phrase like "Aufmacher" or "accroche". The table tt_news_cat has the field title_lang_ol (lang_ol means: language overlay) to enable translation.

Example of tt_news_cat:

• title: lead story
• title_lang_ol: de:Aufmacher|fr:accroche :sup:`0 <#sdfootnote1sym>`_

Tables¶

We need tables with localization and language overlay.

The extension tt_news is a good example:

tt_news is a localized table with the fields:

• • sys_language_uid
  • l18n_parent
  • l18n_diffsource

• tt_news_cat is a table with a language overlay field:

  title_lang_ol

TYPO3 Languages¶

Extend your TYPO3 installation with languages.

In our example above we have

• a default language (there is no record in the table "Website Language"). The default is German and has the uid 0.
• Englisch (uid 1) and
• Französisch (uid 2)

Translated Page with the Browser plugin¶

Create a page and add the plugin Browser. Translate the page to English and French.

You need a translated page, if you want to display Browser results in a non default language.

You need a translated plugin Browser only, if you like to use a different header in a non default language.

The starting point of the plugin Browser is the folder with your news.

Translated Sysfolder¶

The sysfolder with your records (in this case: news) has to be translated too. Otherwise you can't store a record in another language than the default language.

Localized Local Table¶

The illustration below displays a localized local table: tt_news has translated records.

The content of your sysfolder should be look like the illustration above.

The alternative page language records.

The first news is translated into English but not into French.

You can translate (localize) the news into French by clicking the French icon.

The second news isn't translated in any language.

Foreign Table with Language Overlay¶

The illustration below displays the foreign table with a language overload field: tt_news_cat has translated categories.

Please note:

The Browser enables language overlay phrases with a language prefix like

en:Lead Story|fr:Accroche

This is an enhancement of the common language overlay phrases without an language prefix.

If you like to use the common way without language prefixes please configure:

plugin.tx_browser_pi1.advanced.localization.TCA.value.langPrefix = 0

Copy the Code¶

You find the whole TypoScript code in

res/setup.txt

You can copy it into your page template.

What do you need¶

• The page with the browser plugin needs an TypoScript template.
• Include the include static template from the browser.
• Configure in the field [setup] the:

language configuration

a language menu

the Browser configuration

Language configuration¶

If your are uisng more than the default language, you have to configure the behavior of each language.

config {

linkVars = L

metaCharset = UTF-8

sys_language_uid = 0

sys_language_mode = strict

sys_language_overlay = 0

language = de

locale_all = de_DE

htmlTag_langKey = de

}

[globalVar = GP:L = 1]

config {

sys_language_uid = 1

sys_language_mode = content_fallback

sys_language_overlay = 1

language = en

locale_all = en_GB

htmlTag_langKey = en

}

[global]

[globalVar = GP:L = 2]

config {

sys_language_uid = 2

sys_language_mode = strict

sys_language_overlay = hideNonTranslated

language = fr

locale_all = fr_FR

htmlTag_langKey = fr

}

[global]

Language Menu¶

The code

// If we have single view, the menu should have the record uid

temp.addParams = COA

temp.addParams {

10 = TEXT

10 { tx_browser_pi1[showUid]

dataWrap = &tx_browser_pi1[showUid]={GPvar:tx_browser_pi1|showUid}

if.isTrue.data = GPvar:tx_browser_pi1|showUid

}

}

// The language menu

temp.nav_language = HMENU

temp.nav_language {

special = language

special.value = 0,1,2

special.normalWhenNoLanguage = 1

1 = TMENU

1{

NO {

linkWrap = <span> | </span> || <span class="last"> | </span>

linkWrap = <li class="no">|</li>||<li class="no">|</li>||<li class="no last">|</li>

stdWrap.override = Deutsch || English || Französisch

additionalParams {

cObject < temp.addParams

}

}

ACT = 1

ACT {

doNotLinkIt = 1

linkWrap = <span class="act"> | </span> || <span class="act last"> | </span>

linkWrap = <li class="act">|</li>||<li class="act">|</li>||<li class="act last">|</li>

stdWrap.override = Deutsch || English || Französisch

}

wrap = <ul class="navi-ul">|</ul>

}

}

// Add the language menu to your page object

// Adapt this to your page object

page.10.subparts.navi {

10 < temp.nav_language

22 >

}

// Adapt this to your page object

Browser¶

// Two list views and two single views

plugin.tx_browser_pi1. views {

list.1.select = tt_news.title, tt_news_cat.title

list.1.select = tt_news.title, tt_news.image

single.1.select = tt_news.title, tt_news.author, tt_news_cat.title, tt_news.short, tt_news.datetime

single.1.select = tt_news.title, tt_news.bodytext, tt_news.image, tt_news.imagecaption, tt_news.imagealttext, tt_news.imagetitletext, tt_news_cat.title

marker.my_title {

value = My News List

lang.de = Meine Nachrichten Liste

lang.fr = Nouvelles Tableau

wrap = <h2>|</h2>

}

}

Backend Illustration¶

Page

The page "Nachrichten" with

• three Browser plugins,
• two alternative page language records and
• the template.

We call the template in the syntax:

• type_page-name_template-uid
• example: +page_nachrichten_382

Template with Setup

Frontend Illustration¶

We have different results in the frontend - depending on the language configuration.

Local Table - Localization¶

Localize your local table means:

Extend your table with the TYPO3 localization fields.

This fields are:

• sys_language_uid
• l18n_parent
• l18n_diffsource

If your are developing with the assistance of the kickstarter you have to activate the option "Enable localization features" only (like in the screen shot below) - that's all.

Foreign Tables - Language Overlay¶

The business of foreign tables is the same like the business of the tt_news_cat (categories) usually.

In this case

don't localize the table.

Extend your foreign table for each field which need a translation with its name and the appendix "_lang_ol" like this example:

• title: The title in the default language
• title_lang_ol: A list of translated phrases for overlaying the default language phrase.

Example with values:

• title: lead story
• title_lang_ol: de:Aufmacher|fr:accroche

If you need the foreign table for more jobs than categorizing it should be a good idea to

localize the foreign table

in the same way like the local table.

sys_language_uid¶

Integer: This value points to the uid of a record from the "sys_language" table and if set, this means that various parts of the frontend display code will select records which are assigned to this language. See ->SELECT

Internally, the value is depending on whether a Alternative Page Language record can be found with that language. If not, the value will default to zero (default language) except if "sys_language_mode" is set to a value like "content_fallback".

sys_language_mode¶

String: Setting various modes of handling localization.

The syntax is "[keyword] ; [value]".

Possible keywords are:

• [default] - The system will look for a translation of the page (from "Alternative Page Language" table) and if it is not found it will fall back to the default language and display that.
• content_fallback - [ Recommended ] The system will always operate with the selected language even if the page is not translated with a page overlay record. This will keep menus etc. translated. However, the content on the page can still fall back to another language, defined by the value of this keyword, eg. "content_fallback ; 1,0" to fall back to the content of sys_language_uid 1 and if that is not present either, to default (0).
• strict - The system will report an error if the requested translation does not exist. Basically this means that all pages with gray background in the Web>Info / Localization overview module will fail (they would otherwise fall back to default language in one or another way).
• ignore - The system will stay with the selected language even if the page is not translated and there's no content available in this language, so you can handle that situation on your own then.

sys_language_overlay¶

Boolean / Keyword: If set, records from certain tables selected by the CONTENT cObject using the "languageField" setting will select the default language (0) instead of any language set by sys_language_uid / sys_language_mode. In addition the system will look for a translation of the selected record and overlay configured fields.

The requirements for this is that the table is configured with "languageField" and "transOrigPointerField" in the [ctrl] section of $TCA. Also, exclusion of certain fields can be done with the "l10n_mode" directive in the field-configuration of $TCA.

For backend administration this requires that you configure the "Web>Page" module to display content elements accordingly; That each default element is shown and next to it any translation found. This configuration can be done with Page TSconfig for a section of the website using the object path "mod.web_layout.defLangBinding = 1".

Keyword:

hideNonTranslated: If this keyword is used a record that has no translation will not be shown. The default is that records with no translation will show up in the default language.