Deze blogpost reeks behandelt mogelijkheden en tools die Umbraco
CMS biedt bij het ontwikkelen van een multilanguage website. In het
eerste deel
zagen welke structurele benaderingen er zijn om een multilanguage
website in Umbraco aan te maken. In deel twee zijn
we dan begonnen met het stap voor stap aanmaken van een
multilanguage website. In dit derde deel gaan we gebruikmaken van
de Relations API en implementeren we een taalkeuze element zodat de
bezoeker tussen taalversies van een pagina kan switchen.
Relations API
Vaak keert men bij multilanguage sites terug naar de homepage
van een andere taalversie, wanneer een andere taal wordt
geselecteerd. Zou het niet veel handiger zijn, dat wanneer men op
de 'Diensten'-pagina zit, men automatisch op de 'Services'-pagina
terecht komt wanneer men de Engelstalige versie selecteert? Met de
Relations functionaliteit in Umbraco kan dit scenario perfect
gerealiseerd worden. Via de Relations API kunnen enkelvoudige of
wederkerige relaties tussen twee objecten (pagina's, documenten,
media, etc ...) gelegd worden. Deze relaties worden opgeslagen in
de umbracoRelation tabel in de database.
In deel twee
zagen we hoe we bij het kopiëren van de Nederlandstalige rootnode
de checkbox 'Relate copied items to original' kunnen aanvinken. Op
dat moment worden alle relaties tussen de gekopieerde nodes en de
orginele nodes weggeschreven naar de umbracoRelation tabel:
fig.1 De umbracoRelation tabel in de
database
Een Language Selector implementeren in Umbraco
Het enige wat we nu nog nodig hebben is een component die het
mogelijk maakt voor de gebruiker om een andere taal te selecteren.
Tim Geyssens beschrijft in zijn blog hoe je zelf zo'n Language
Selector kunt implementeren in je Umbraco website (http://www.nibble.be/?p=32).
Webmove gebruikt echter de uitstekende Goyaweb
Multilanguage Tools, ontwikkelt door Yannick Smits. Deze
language selector bevat ook een Razor-script die automatisch naar
de anderstalige pagina switched indien er een relatie bestaat in de
Relations table. Je hebt ook drie weergave mogelijkheden voor de
Language Selector: een dropdownlist, textuele links of afbeeldingen
van vlaggetjes:
fig.2 weergave mogelijkheden voor de
Language Selector van de Goyaweb Multilanguage Tools
na installatie van de package hoef je enkel een macro aan je
template toe te voegen:
<umbraco:Macro RenderType="Flags" Alias="MLLanguageSwitcher" runat="server"></umbraco:Macro>
De bezoekers kunnen nu een ander taalversie van een pagina
selecteren door op de vlaggetjes van de taalkeuze component te
klikken:
fig.3 De implementatie van de taalkeuze
component op de website
Een andere handige package is de Vizioz
Relationship package van Chris Houston. Deze package voegt een
document type toe via dewelke je de relaties tussen pagina's kunt
beheren in de Umbraco Backoffice.
We zijn nu klaar met onze multi-site structuur voor onze
multilanguage website. We kunnen onze anderstalige websites
onafhankelijk van elkaar beheren, en waar nodig relaties leggen
tussen de onderlinge anderstalige pagina's. Gebruikers kunnen via
een Language Selector de gewenste taal selecteren.
In het vierde en laatste deel zullen we de ingebouwde
Translation Workflow in Umbraco nader bekijken. Deze Translation
Workflow maakt het mogelijk om de samenwerking met professionele
vertaalbureaus te integreren in de Umbraco Backoffice.
