Multi-Language Websites in...

Post on 17-Mar-2018

237 views 6 download

Transcript of Multi-Language Websites in...

Originally presented at Engine Summit - The online ExpressionEngine Summit March, 30th 2010 by John Henry Donovan

Multi-Language Websitesin ExpressionEngine

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 2

IntroductionJohn Henry tackles this popular topic of multi-language websites developed in ExpressionEngine. He discusses the practicalities of client profiling and technical approaches. He shows what is possible out of the box and how to extend functionality using some of the popular add-ons available. Each approach and technique will hopefully deliver a wealth of ideas and tips that should give you a head start when building your first multi-lingual website in ExpressionEngine.

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 3

Profiling

• What does your client want from a multi-language website?

• Who will be updating the website?

• Do they need the ability to add more languages?

• What type of domain are we working with?

• What type of multi-language website is needed?

Client Ability and needs

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 4

ProfilingDeciding on the type of website is a very simple step which is often forgotten when developing a multi-language website. There are in fact 2 different types of websites you can choose from.

VersionsMultiple translated versions

Translations1 version and multiple translations

Type of website

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 5

imagessystem themes en es fr

Technical Approach

http://www.domain.com/es/index.php/template_group/template/http://www.domain.com/en/index.php/template_group/template/http://www.domain.com/fr/index.php/template_group/template/

Domain, Segments & Folders

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 6

Technical Approach

esindex.php

path.php

!"#$%&'()*+*,-$$./0011123456#728450%"09:!"#$%&#73%;*+*,9:!"#$%&<=<*+*,9:!>)4?6)&@6("*+*6((6AB****,84'7$(A&843%9*+C*,%"9D****,)67>'6>%9*+C*,".67#"-9E:*00*F-#"*6((6A*5'"$*?%*6""48#6$#@%

Global Variables & path.php

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 7

Technical Approach

Templates Tags

G%;./1%?)4>/%7$(#%"*1%?)4>+9G56"$%(&1%?)4>H9H

* I-J*8)6""+9$#$)%9CG#K*84'7$(A&843%*L+*,%79HGG84'7$(A&843%H&$#$)%H** *G#K/%)"%HG$#$)%HG0#KHI0-JC

* GG84'7$(A&843%H&"'556(AH

* GG84'7$(A&843%H&?43AH

G0%;./1%?)4>/%7$(#%"H*

Add the country code to all of your custom fields en_body, es_body etc.

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 8

Technical Approach

.htaccess

M*(%1(#$%*(')%"N%1(#$%O7>#7%*P7

M*3#$8-*#73%;2.-.N%1(#$%Q473*RGNOSTOUF&VWXOYZ[OH*L\KN%1(#$%Q473*RGNOSTOUF&VWXOYZ[OH*L\3N%1(#$%N')%*]B2^E!*0%"0#73%;2.-.0!_*`Xa*

es

index.php path.php .htaccess

http://expressionengine.com/wiki/Remove_index.php_From_URLs/

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 9

Structure (Third Party Add-on)

Structure is a different way to build ExpressionEngine sites. It forgoes the current template_group/template setup and creates‘static’ and ‘listing’ pages that are all editable through a tree sitemap view. http://buildwithstructure.com/

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 10

Structure (Third Party Add-on)

Alternative Languages Setup

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 11

Structure Tab Settings

Structure (Third Party Add-on)

http://www.mydomain.com/es/index.php

http://www.mydomain.com/es/about/

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 12

Structure (Third Party Add-on)

G#K*"%>5%7$&_**b%"c*PN*"%>5%7$&_**bK(cH* GL\\*UFZNF*VNP[*UOd[OYF*J*WV*YPF*eOVZTXF*XZYdTZdO*\\H* G%;./"$('8$'(%/76@&"'?*"$6($&K(45+c0G"%>5%7$&_H0G"%>5%7$&JHcHG#K/%)"%H* GL\\*UFZNF*VNP[*UOd[OYF*_*WV*eOVZTXF*XZYdTZdO*\\H* G%;./"$('8$'(%/76@&"'?*"$6($&K(45+c0G"%>5%7$&_HcHG0#KH

Example nav_sub code

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 13

LG Multi Language Pro (Third Party Add-on)

Developed by Leevi Graham of Newism Web design & Development. The add-on bundle was commissioned by myself to suit a particular client’s needs and workflow. It will hopefully be released back into the community by Leevi.

http://newism.com.au/

• Based on member group, hide unnecessary custom fields

• Needed a way of showing the status of a translation

• A phrase translator with separate plugin

Background & Design Brief

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 14

LG Multi Language Pro (Third Party Add-on)

Extension & Member Settings

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 15

LG Multi Language Pro (Third Party Add-on)

Custom Fields & Phrase Translator

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 16

LG Multi Language Pro (Third Party Add-on)

Publish & Edit

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 17

LG Multi Language Pro (Third Party Add-on)

Code Examples

G%;./)>&5)./$(67")6$%*f%A+9.-(6"%&f%A&_9H

G%;./1%?)4>/%7$(#%"*1%?)4>+9G1%?)4>&765%H9*)#5#$+9_9H* * I-_CG#K*)>&)67>*++*,%79*gg*G)>&)67>H&$#$)%**++ccHG$#$)%HG#K/%)"%HGG)>&)67>H&$#$)%HG0#KHI0-_C

* * * G#K*G)>&)67>H&?43A**++ccH****** * * * G%7&?43AH****** G#K/%)"%H****** * * * GG)>&)67>H&?43AH****** G0#KHG0%;./1%?)4>/%7$(#%"H

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 18

LG Multi Language Pro (Third Party Add-on)

Structure Mashup

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 19

Localisation

Google Maps

I"8(#.$*"(8+9-$$./0056."2>44>)%2845056."hi)%+6.#j65.:@+Jj65.:f%A+ZkSWZZZZPl816m@TJe#Nn3o1FPZQpNSqpO"&r(\%Ts)eJFe5<"%TkqtekkF8.ru"p_)e3?A>(qv$o3Vlr&\<F1j65.:-)+G84'7$(A&843%H:9******$A.%+9$%;$0m6@6"8(#.$9CI0"8(#.$C

http://code.google.com/apis/maps/documentation/#Localization

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 20

Localisation

jQuery UI

* I"8(#.$*$A.%+9$%;$0m6@6"8(#.$9*"(8+90#780"8(#.$"0#_t70'#236$%.#8f%(\G84'7$(A&843%H2m"9CI0"8(#.$C* I"8(#.$*$A.%+9$%;$0m6@6"8(#.$9C* * !BK'78$#47BE*G** * !B,M34?9E236$%.#8f%(B!236$%.#8f%(2(%>#476)`bG84'7$(A&843%HcaE:* * HE:* * I0"8(#.$C

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 21

ExpressionEngine 2.0 and beyondNew publish layout feature is a translation gift in disguise!

Member Groups & Fields

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 22

ExpressionEngine 2.0 and beyondNew publish layout feature is a translation gift in disguise!

Publish Layout & Tabs

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 23

ExpressionEngine 2.0 and beyondNew publish layout feature is a translation gift in disguise!

Seperating Fields

Multi-Language Websites in ExpressionEngine by John Henry Donovan 2010 - @johnhenry_ie PAGE 24

Resources

Add-onshttp://buildwithstructure.com/

http://expressionengine.com/wiki/Multi_language_site/http://expressionengine.com/wiki/multi-lingual_site_-_an_easy_alternative/http://expressionengine.com/wiki/Multi_language_site_alternative/

http://www.putyourlightson.net/projects/multi_languagehttp://publicdownloads.biberltd.com/ee_extensions/ext.bbr_langswitch.ziphttp://leevigraham.com/cms-customisation/expressionengine/lg-multi-language/

Wiki Articles

Go raibh maith agaibh