Meertalige Hyvä-webshops: store views, vlaggen en vertalingen

Veel Europese Magento-webshops verkopen in meer dan één taal. Een overstap naar Hyvä verandert niets aan hoe Magento daarmee omgaat, maar wel aan waar een deel van het werk gebeurt.

Onze Hyvä-demowebshop draait Engelse en Duitse store views met een taalkeuze met vlaggen. In dit artikel delen we hoe we dat hebben ingericht en waar je op moet letten.

Store views blijven de basis

Hyvä is een frontendthema. Websites, stores en store views werken precies zoals in elke Magento 2-installatie.

Elke taal krijgt een eigen store view met een eigen locale, ingesteld onder Stores > Configuration > General > Locale Options.

Productnamen, omschrijvingen, categoriecontent, CMS-pagina's en URL-keys kun je allemaal per store view instellen. Het thema bepaalt alleen hoe die content wordt getoond.

Verkoop je ook in meerdere valuta of landen, dan is de structuur van websites en stores belangrijk voor prijzen, btw en betaalmethoden. Ons artikel over internationale checkout in Hyvä behandelt die kant.

Kies vroeg een URL-structuur

Er zijn twee gangbare patronen voor taalversies:

• Storecode in de URL, zoals /en/ en /de/ op één domein. Dit is eenvoudig te beheren en je houdt één certificaat en één CDN-zone.
• Aparte domeinen of subdomeinen per land. Dit past bij webshops met een sterk lokaal merk in elke markt.

Beide werken met Hyvä. Waar het om gaat is dat je vóór de livegang beslist, want URL's later wijzigen betekent redirects en een periode van onzekerheid bij zoekmachines.

Wat je ook kiest, koppel de taalversies aan elkaar met hreflang. Magento geeft standaard geen hreflang-tags uit, dus daarvoor heb je een module of een klein maatwerkblok nodig. De SEO-kant behandelen we in Hyvä SEO: schone markup, structured data, crawlefficiëntie.

Vertalingen horen in het thema

Magento-vertalingen komen uit CSV-bestanden in modules, taalpakketten en het thema. Op een Hyvä-webshop houden we winkelspecifieke formuleringen in het child theme:

app/design/frontend/Vendor/hyva-child/i18n/de_DE.csv
"Add to Cart","In den Warenkorb"
"Proceed to Checkout","Zur Kasse"
"Delivery in 2-3 working days","Lieferung in 2-3 Werktagen"

Themavertalingen worden na modulevertalingen toegepast, dus dat is de juiste plek voor je eigen tone of voice.

Om teksten te vinden die nog vertaald moeten worden, verzamel je de zinnen uit je thema en vergelijk je ze met de CSV:

bin/magento i18n:collect-phrases app/design/frontend/Vendor/hyva-child

Houd er rekening mee dat een taalpakket je een basis geeft, niet je merkstem. We controleren de teksten in checkout, winkelwagen en account altijd met de hand.

Teksten in Alpine.js-componenten

Hyvä-componenten zijn geschreven in Alpine.js, vaak binnen PHTML-templates. Dat maakt vertalen makkelijker dan in de Knockout-templates van Luma, omdat de tekst meestal door PHP wordt gerenderd.

Is een tekst nodig in JavaScript, render hem dan via de vertaalfunctie van Magento en escape hem voor JavaScript:

<div x-data="{ added: '<?= $escaper->escapeJs(__('Added to your basket')) ?>' }">
    ...
</div>

Vermijd hardgecodeerde Engelse teksten in Alpine.js-componenten. Ze worden makkelijk over het hoofd gezien bij een review en duiken op in Duitse pagina's zodra een klant ergens op klikt.

Static content moet ook worden gedeployed voor elke locale die je gebruikt, anders ontbreken er voor één taal bestanden:

bin/magento setup:static-content:deploy -f en_GB de_DE

Een taalkeuze met vlaggen

Magento heeft al een store switcher. Op onze demowebshop hebben we de template ervan in het child theme aangepast om naast elke taal een vlag te tonen.

Vlaggen zijn een snelle visuele hint, maar ze staan voor landen, niet voor talen. Duits wordt bijvoorbeeld in meerdere landen gesproken.

Daarom tonen we naast de vlag altijd de naam van de taal als tekst. Dat helpt ook gebruikers van schermlezers, die anders niets bruikbaars zouden horen.

De switcher moet de bezoeker naar dezelfde pagina in de andere taal brengen als die bestaat, niet terug naar de homepage. Magento regelt dit als URL-keys per store view zijn ingesteld.

Checkout en e-mails verdienen een eigen controle

In de checkout doet onvertaalde tekst het meeste pijn. In Hyvä Checkout, dat op Magewire is gebouwd, komen labels uit PHP-templates en dezelfde vertaalbestanden als de rest van de webshop.

Betaal- en verzendmodules brengen vaak hun eigen teksten mee, dus controleer elke methode die je aanbiedt in elke taal.

Transactionele e-mails stel je ook per store view in. Zorg dat elke store view de juiste e-mailtemplates en afzendergegevens gebruikt.

Content per taal, niet alleen vertaling

Vertaalbestanden dekken de interface. Productdata, categorieteksten, CMS-pagina's en banners zijn content, en daarvoor heb je een eigen plan nodig.

Bepaal vroeg wie elke taal schrijft en controleert, en welke content tussen store views wordt gedeeld. Homepagebanners hebben per markt vaak andere afbeeldingen nodig, niet alleen andere tekst.

Valkuilen waar we tegenaan liepen

• Vertalingen per store view. Een zin die op de ene plek vertaald is, kan in een andere context nog onvertaald verschijnen. We testen echte pagina's per store view in plaats van alleen op de CSV te vertrouwen.
• Gecachete pagina's in de verkeerde taal. Regels voor full-page cache en CDN moeten store views gescheiden houden. Zie full-page caching van een Hyvä-webshop met Cloudflare.
• Ontbrekende locales in de static deploy. Eén vergeten locale in het deployscript is genoeg om een taal kapot te maken.
• Content die alleen op de standaardscope is ingevoerd. Bestaat een CMS-blok maar voor één store view, dan toont de andere taal een lege plek.

Een korte checklist voor de livegang

1. Eén store view per taal, met de juiste locale.
2. URL-structuur gekozen en hreflang gepland.
3. CSV-bestanden van het thema compleet voor elke locale.
4. Geen hardgecodeerde teksten in Alpine.js-componenten.
5. Static content gedeployed voor elke locale.
6. De switcher toont taalnamen en blijft op de huidige pagina.
7. Checkout, accountpagina's en e-mails getest in elke taal.

Veelgestelde vragen

Ondersteunt Hyvä meerdere talen?

Ja. Hyvä gebruikt de standaard store views, locales en vertaalbestanden van Magento, dus meertalige webshops werken zoals op elk Magento 2-thema.

Worden Luma-vertalingen hergebruikt op Hyvä?

Vertalingen van modules en taalpakketten blijven gelden. Teksten die in Luma-themetemplates of Knockout-bestanden stonden, moet je controleren, omdat Hyvä die templates vervangt.

Moet ik vlaggen gebruiken in de taalkeuze?

Vlaggen zijn prima als visuele hint, maar toon altijd ook de naam van de taal als tekst. Vlaggen staan voor landen, en veel talen worden in meer dan één land gesproken.

Plan je een meertalige Hyvä-webshop of wil je er een overzetten vanaf Luma? Bekijk onze dienst voor Hyvä-themaontwikkeling of neem contact op.