BUILDING MULTILINGUAL WEBSITES WITH DRUPAL 7
About us!
Getting to know you...
What are your multilingual needs?
What you need
Check A fresh Drupal 7 instance installed locally Download of module files
Previous experience Familiar with Drupal site building? Experience setting up content types and Views Optional: Experience creating a simple glue module or custom theme?
What s in the box?
What you have Your local development environment Your manual Browser opened to drupal.org * * You re always logged in, right?
Resources: Code & files Go to https://github.com/acquia/training/ Click themes download all files
What we ll do today Demos and presentations Exercises in manual Review and practice
What are we building?
Schedule What we ll do today
Schedule Setting up a multilingual site, installing a language Making the user interface multilingual Configuring multilingual content Building blocks for many languages Translation workflows for content + UI Extending Drupal multilingual
Session 1 MULTILINGUAL USER INTERFACES
Multilingual Requirements
Internationalization aka i18n Developing a website that enables localization. Separating elements that should be localized so they can be specified for each locale.
Localization aka l10n Process of adapting a website for a certain locale including: Text and graphics Numeric, date and time formats Currency Time zones Legal requirements
Translation The act of translating the text of a website into another language Part of the localization process
Multilingual Website A website that displays information in multiple languages Involves internationalization of functionality and localization of content and settings
What kind of site are you building? How many languages do you need to support? Does the user interface need to be fully translated? Are there elements other than text that have to be localized? Do you have content in all languages? Is all the content translated?
Lots of reasons for multilingual websites Reach a wider audience Search engine optimization Government regulations Company policy
Multilingual Resources Personnel User-Interface Translators Content Translators QA for each Language Resources Contributed Translations (localize.drupal.og) Machine Translation Translation Manager
What is Multilingual Drupal?
Foreign-language site
Multilingual Site
Multilingual Site with Translation
Multilingual Modules Core modules: Locale Content Translation Contributed Modules: i18n (Internationalization) Entity Translation Others provide additional functionality
Installing a New Language
The Language of Drupal Drupal out-of-the-box is in English Text in modules and themes Text stored in the database To change the language of Drupal you need to install another language
Building a website in another language
Installing Languages Configuration > Regional & language > Languages
Installing Languages Configuration > Regional & language > Languages
Configuring a Language
Language Detection When you arrive on the site, which language to show? English UI French UI
Drupal Core is Language Aware The t function is defined in bootstrap.inc. From the beginning of each page load, Drupal knows what language to render your site in.
Language Detection & Selection Using the URL as the primary method of language detection
Path Prefix vs. Domain Path prefix: example.com/fr/user Domain: exemple.com/user Domain: fr.example.com/user
Path Prefix vs. Domain Configuration > Regional & language > Languages > French Configure the path prefix or domain for each language
Language Detection & Selection The default language is used if there s no language in the URL
Language Detection & Selection You can also enable other methods of detection
Detection and Selection example.com/user
Detection and Selection example.com/fr/user
Choosing a Default Configuration > Regional & language > Languages
Switching Languages
Your turn Install the French language on your site Configure the Detection and Selection settings Add a language switcher to the site.
Types of Text in Drupal
Types of Text Built-in interface (Code) Content i18n Strings Built-in interface (User-Defined) Variables
Translation Interfaces in Drupal Built-in interface (Code) Built-in interface (User-Defined) i18n Strings i18n Strings Variables Content
Translating Built-in Interface Text (from Code)
Built-in Interface (Code)
Using Translations from Localize.Drupal.org
Use Localize.Drupal.org Each language has a project Translators contribute translations in their language Some projects have better coverage than others.
Localize.Drupal.org Project Page
What is a.po file? Text file storing the original text and the translations. A.pot file is a template file, containing only the original text to be translated.
Upload.po files to Drupal
Overriding Translations in Drupal
Overriding a Translation
Searching for the String
Editing the Translation
Testing the Change
Your turn Download translations from localize.drupal.org and upload them to your site Override a translation in Drupal
Use Localization Update
Localization Update drupal.org/project/l10n_update
Localization Update
Translation Overview
Your turn Use the Localization Update module to pull in more translations from Drupal.org
Use Localization Update
Localization Update drupal.org/project/l10n_update
Localization Update
Translation Overview
Your turn Use the Localization Update module to pull in more translations from Drupal.org
Use Localization Client
Use Localization Client drupal.org/project/l10n_client
Sharing Your Translations Add your API key from localize.drupal.org to contribute your translations back to the community.
Demo!
Translating Built-in Interface Text (User- Defined)
User-Defined Text Text entered via the Views UI
User-Defined Text Text entered via the Flag UI
User-Defined Text Original Text French Translation Drupal Database Recent Articles Articles récents Added to the Views UI Added via the Translate Interface UI
Translate Interface
Add the Translation
Refresh the Translations
Source Language Configuration > Regional and language > Multilingual settings > Strings
Configuration in the Default Language
Translating Variables
Translating Variables
Selecting Variables Configuration > Regional & language > Multilingual Settings > Variables
Translating Variables
Your turn Add a site title and slogan and translate them.
Session 2 MULTILINGUAL CONTENT
What content experience are you building?
Fully Symmetric Experience English Polish
Asymmetric Experience French English
Mixed Language Experience English French
What about untranslated content?
Show Untranslated Content
Hide Untranslated Content French English
Content Translation Methods
Content Translation Methods Node-Level Translation Field-Level Translation Node 1 (English) Node 2 (French) Node 3 (German) Node 1 Title (English) Title (French) Title (German) Title (English) Title (French) Title (German) Image Image Image Image
Node-Level Translation
Node-Level Translation Content Translation module (Drupal core) New node for each translation Nodes are mapped together in a translation set
Translating Nodes Translation Set Node 1 (English) Node 2 (French) Node 3 (German) tnid = 1 tnid = 1 tnid = 1
Enabling Node-Level Translation
Translating a Node
Node Properties Independent node properties per language
Use Cases Asymmetric menus per language Language-specific features (flagging, sign-up, moderation) Curation of content per language
Limitations of Node-Level Translation Everything is language-specific by default Need to synchronize data between nodes Too many nodes Doesn t work for modelling languageneutral things (groups of people, products, data) Only works for nodes
Your turn Configure basic pages on your site to use node-level translation
Field-Level Translation
Field-Level Translation Translation of fields instead of nodes Entity Translation module (contrib) provides the UI Fields are translatable in core
Translating Fields Node 1 Language Specific (Fields) Language Neutral Title (English) Title (French) Title (German) Image Author Body (English) Body (French) Body (German) Post Date Facebook Likes A single node, with translations of certain fields.
Setting up Field Translation
Setting up Field Translation
Translating the Title
Adding a Translation
Adding a Translation
Comment Filtering When does it make sense to show all comments regardless of language? Would you ever consider translating comments? Do comments have language neutral fields that are valuable to users who don t speak the language?
Comment Filtering
Comment Filtering
Language Neutral Features Flags Voting Data Signups Nodequeue or Draggable Views Data Moderation / Scheduler settings Entity references Panels nodes layout Content Access Social Media Integration (Add This) Views Bulk Operations
Your turn Set up field-level translation for articles Translate some article fields and filter your comments by language
Choosing a Translation Method
Event
Event Language-specific Title Description What to bring URL Language-neutral Image Sign-up List Sign-up Deadline Published Status Date/Time Location Organizer
Issue
Issue Language-specific Title Description URL Language-neutral Bookmark (flag) Status Priority Assignee Comments
List Item
List Item Language-specific Text Alt text URL Language-neutral Order (Nodequeue, Draggable Views) Image Published status
Planning Content Translation
Your turn: Planning Multilingual Content Destination Page User Blog Post Destination Name User Bookmarks Author Related Destination Photos Blog Content Articles User Blog Posts Comments
Content Translation Methods Node-Level Translation Field-Level Translation Node 1 (English) Node 2 (French) Node 3 (German) Node 1 Title (English) Title (French) Title (German) Title (English) Title (French) Title (German) Image Image Image Image
Questions to Ask Will this content be translated? If not, will it be displayed in other languages? Which translation method to use? Which fields need translation/localization? Are entities referenced from this content type translated?
Your turn Plan out the addition of destination pages and user blogs to the GlobalTravel website Map out what field types/translation methods you ll use the represent this content Report back to the group
Translating Other Entity Types
Translate Core Entities Translation of entities from core modules
Translate Users Configure Fields Translate Users Permissions
Translate Users: Use Cases Team member profiles Multilingual community site Users who offer a service to users in more than one language
Translate Users: Drawbacks Single permission for users (can translate any user entity) UI is not self-explanatory
Translate Terms Configure Fields Translate Terms Permissions
Translate Terms: Use Cases Any vocabulary that is symmetric across languages: Categories Destinations Medical Topics
Translate Terms: Drawbacks Time-consuming to use translation UI Single permission for translating all vocabularies Alphabetical listings in Views will use source language
Translate Comments Configure Fields Translate Comments Permissions
Translate Comments: Use Cases Travel website (machine translation of reviews) Government website (human translation of questions + answers)
Translate Other Entities Translation of entities from contributed modules Entities need to have fields and include translation support in hook_entity_info()
Product
Product Language-specific Title Description URL Language-neutral SKU Status Image Price Quantity Remaining Shopping Cart Status
Translatable Commerce Product
Product
Product
Translate categories using entity translation Your turn
Multilingual Views
Mixed-Language Views English Do you want the view to show untranslated content? French
Filtering by Language Entity Translation Content Translation
Field Options in Views
Your turn Create a view to display page nodes in the current language only Create a view to display articles
Translating the Homepage
Multilingual Homepage Options: Filter content to display in the current language only Make the default frontpage a multilingual variable + create a page for each language Set up a multilingual view at a single path to use as the homepage
Multilingual Selection
Translate the Frontpage
Your turn Configure multilingual selection options Set up a the default frontpage as a multilingual variable
Session 3 MULTILINGUAL STRUCTURE
Overview What else in Drupal needs translation? Field settings Blocks Paths Date Formats Emails to Users Menus
Text Groups Menu Fields Blocks Taxonomy
Translating Field Settings
Field Settings /fr/node/add/article Label Description
Translating Field Settings Field Translation module (i18n) Translate field settings Label Description Options Default Value Only core field settings
Translate Interface
Field Translate Tab
Translate Field Settings
Translating Options
Field Display Formatters Change the formatter so the translated field value is displayed
Your turn Translate field settings on your article content type.
Translating Blocks
Translating Blocks Block Translation module (i18n) Make blocks translatable Display blocks only in certain languages
Translating Blocks
Translating Blocks
Translating Blocks
Translating Blocks Create a translatable block for all languages on your site. Create a block targeting a specific language.
Translating Paths
Path Translation
Pathauto Patterns Create a pathauto pattern per language
Transliteration Articles Récents = articles-recents
Transliteration Articles récents = articles-recents
Your turn Set up pathauto for multilingual content Use transliteration for pathauto Use the Path Translation module for the Recent Articles view
Multilingual Navigation
Translating Menus Menu Translation module (i18n) Menu per language OR Menu items per language
Translating Menus
Translating Menus Menu Link to a Node
Translating Menu Items Menu Link to a Single-Language Page i.e. Events View
Translating Menu Items Menu Link to a Generic Page i.e. Home Page
Translating Menu Items
Session 4 TRANSLATING CUSTOM AND CONTRIB MODULES
Modules to Extend Drupal s Multilingual Functionality
Adding Functionality + Contact Form Meta Tags Site Map
Contact Form Translation of form labels Recipients per language? What other language is involved?
Meta Tags How are meta tags attached to each node? Will translators have permission to add them?
Is this module multilingualcompatible?
Your turn Take a sample module you re considering using for your current project. How would you determine whether it s multilingual-compatible?
Your turn What type of text does the module introduce? Does the module introduce data that will need to be translated that isn t an entity? Does the module add variables to the system table? Does the module provide any new content types? How many of the built-in module strings are translated for French? Can you find any unresolved multilingual-related issues in the module s issue queue?
Creating a glue module for a multilingual website
Using the t function print t( Welcome to GlobalTravel );
!variable <?php $message = t("if you don't want to receive such e-mails, you can change your settings at!url.", array('!url' => l(t('my account'), "user/$account->uid")));?> The $account variable includes HTML
@variable <?php $title = t("@name's blog", array('@name' => $account->name));?> The @name variable is run through check_plain
%variable <?php $message = t('%name-from sent %nameto an e-mail.', array('%name-from' => $user->name, '%name-to' => $account->name));?> The %name-from and %name-to are emphasized text (wrapped in <em>)
Using Drupal.t in jquery var txt = Drupal.t("You are viewing the site in!language.", params);
Multilingual Theming
Theming Tips Translate text that isn t visible Keep text out of images Use selectors for languages (only when absolutely necessary) Keep text overrides in theme preprocess functions/text files Use the t function in the theme
Space Requirements English French
Right to Left Languages English Hebrew
Localizing Date Formats
What are date formats? Friday, July 23rd, 2012 6:30pm vendredi le 23 juillet, 2012 18:30 07/23/2012 6:30pm 2012-07-23 18:30
Date Format Documentation http://php.net/manual/en/function.date.php
Define new formats
Localizing Date Formats
Date formats in Views
Your turn Create a localized date format for French Add dates to the Recent Articles View
User Language Preferences
User Language Preference
Set on Account Creation
Used in Language Detection
Language Preference for User Emails
Session 5 TRANSLATION WORKFLOWS
Translation Workflows
Cost of Translation Time-consuming Expensive How can you speed up the process and reduce the amount of text to be translated?
What are Translation Workflows? Translator
Benefits of an External Translation Tool Translation teams are used to an external tool Tracks cost of translation Provides integration with machine/ community sourced translations Advanced tools (translation memory) Integration with multiple translation teams
Benefits of an Internal Translation Tool Easy to set up Add translations as you go Less costly Takes advantage of Drupal s content management tools Easier to provide context
Discussion Which approach would work better at your organization?
Translation Workflows for UI Strings
Translation Workflow for UI Strings 1. Pull in contributed translations from localize.drupal.org 2. Override translations + add translations of custom strings Translator
Overriding/Adding Translations Outside of Drupal
Use POEdit to Translate
Translations Spreadsheet
Translating Outside Drupal CSV with Translations Translator CSV Template.po file for each language
Re-using Your Translations
Translating User- Defined Strings
User-Defined Strings Strings added in the admin UI (not in code) For example: Views text
Other User-Defined Strings Block text Menu items Field settings
Translate Interface
Translate Tab
Translate Tab
User-Defined Strings
Challenges Giving translators access to block/field/ menu configuration Allowing translators to use all input formats Changing the original values Changing the default language
Translation Workflows for Content
Content Translation Workflow 1. Author creates a new node 2. Translators adds a translation Author Translator
Translation Workflows for Content: Translating in Drupal
Translation Interface in Drupal
Node-Level vs. Field-Level Translation Field-Level Translation Node-Level Translation
Creating a Translation Workflow from Scratch Permissions for translators Rules and Flag to trigger translation requests Views for Translators
Permissions for Translation Content Translation: Translators need to be able to create content Entity Translation: Permission to edit the entity No granular translation permissions per content type (use i18n_access)
Challenges Different UI for Entity Translation/Content Translation (Confusing) Professional translators need to learn Drupal Need to build system for reviewing translations
Typical UI for Translators
Your turn Set up permissions for translators Create a view for translators
Translation Workflows for Content: TMGMT Module
Translation Management Tool (TMGMT) drupal.org/project/tmgmt
Translation Management Tool (TMGMT) Drupal
Translators Microsoft (Bing) Translator (machine) Google Translate (machine) Nativy (human) MyGengo (human) Supertext (human) One Hour Translation (human)
Microsoft Translator
Microsoft Translator
Requesting Translations
Choosing a Translator
Review Translation
Review Translation
Accepted Translation Appears
Translate in Bulk
Translation Jobs
Benefits of TMGMT Field-level and node-level translation Also translate i18n strings (in development) Easy to configure Human/machine translator plugins Write your own translator plugin
Translation Workflows for Content: Lingotek Module
Lingotek Module drupal.org/project/lingotek
Lingotek Drupal Individual Translator
Create a Lingotek Account
Connect to Machine Translation Tool
Create a Project Create a new project for each Drupal website
Lingotek Translation Per Content Type Disables manual translation of content
Lingotek Translation Tool Enables translation at the field-level Need to flag fields as being translatable
Send a Node for Translation
Translating a Node Switch the site to French, and you ll see a message: Click on the link to go to the Lingotek Translation UI
Updating the Translation In order to accept the translation and publish it to the site, you have to click Update.
Translation Appears
Project Status
Benefits of Lingotek Translation memory Sophisticated translation workflow Advanced feature set (i.e. settings for tokens to ignore, etc.) Community-sourced translations Provides a UI for professional translators
Importing Content
Modules for Importing Migrate + Migrate Extras Entity Translation: Feeds
Session 8 REVIEW
Multilingual Checklist Installing languages Translating the Interface Translating content Setting up multilingual building blocks Configuring a translation workflow Auditing/configuring contrib modules
Before you start How many languages? Who are the translators? How will content be translated? What method should be used? Choose a default language that makes sense Have a plan for translation workflow + adding languages in the future Leave extra time for testing contrib modules
What to Avoid? Changing the default language Passing variables through the t function Putting non-english text in code
http://acquia.com/training-feedback Feedback please!
Q + A