Breakdance vertalen met TranslatePress

Gebruik je Breakdance als page builder en TranslatePress voor meertaligheid? Dan kun je de inhoud van je Breakdance-website rechtstreeks vanuit de voorkant van de website vertalen.

TranslatePress werkt hierbij visueel. Je ziet de website zoals een bezoeker die ziet en kunt vervolgens onderdelen selecteren om te vertalen. Dit werkt ook met content die met een page builder zoals Breakdance is opgebouwd. TranslatePress heeft hiervoor ondersteuning voor page builders en heeft in recente versies bovendien de compatibiliteit met Breakdance verbeterd.

In deze handleiding leggen we stap voor stap uit hoe je een Breakdance-website vertaalt met TranslatePress.

1. Talen instellen in TranslatePress

Voordat je begint met vertalen, moeten de gewenste talen zijn ingesteld.

Ga in WordPress naar:

Instellingen → TranslatePress

Onder Translation Languages voeg je de talen toe waarin je website beschikbaar moet zijn.

Bijvoorbeeld:

• Nederlands (nl_NL)
• Engels (en_GB)

De standaardtaal van de website stel je in bij Default Language. Dit is de taal waarin de website oorspronkelijk is opgebouwd.

Sla de instellingen op nadat je de gewenste talen hebt toegevoegd.

2. De TranslatePress-editor openen

Je kunt de TranslatePress-editor op verschillende manieren openen.

De eenvoudigste manier is om naar de pagina te gaan die je wilt vertalen en in de WordPress-toolbar bovenaan te kiezen voor:

Translate Page

Je kunt de editor ook openen via:

WordPress → Instellingen → TranslatePress → Translate Site

TranslatePress opent vervolgens de website aan de voorkant met de vertaalinterface. Aan de linkerkant staat het TranslatePress-paneel en rechts zie je de website.

3. Een Breakdance-element vertalen

Wanneer de TranslatePress-editor geopend is, kun je rechtstreeks een element op de pagina selecteren.

Beweeg met je muis over de tekst die je wilt vertalen.

Er verschijnt een potloodicoon.

Klik op het potloodicoon om de tekst te selecteren.

In het TranslatePress-paneel aan de linkerkant verschijnt vervolgens de geselecteerde tekst. Daar kun je de vertaling invoeren.

Bijvoorbeeld:

Nederlands

Neem contact met ons op

Engels

Contact us

Klik vervolgens op Save translation om de vertaling op te slaan.

TranslatePress toont de vertaling direct in de live preview.

4. De juiste taal selecteren

Bovenaan het TranslatePress-paneel kun je de taal selecteren waarin je de website wilt bekijken en vertalen.

Bijvoorbeeld:

Dutch → English

Wanneer je English selecteert, bekijk je de Engelse versie van de pagina.

Je kunt vervolgens door de pagina gaan en alle nog onvertaalde teksten selecteren.

Dit maakt het mogelijk om de website pagina voor pagina en element voor element te vertalen.

5. Teksten in Breakdance vertalen

Breakdance bestaat uit verschillende elementen. TranslatePress kan de zichtbare tekst van deze elementen herkennen.

Denk bijvoorbeeld aan:

• Headings
• Paragraphs
• Buttons
• Links
• Lists
• Accordions
• Tabs
• Formulieren
• CTA’s
• Navigatie
• Footer
• Header

De werkwijze is steeds hetzelfde:

1. Open de pagina met TranslatePress.
2. Selecteer de gewenste taal.
3. Beweeg over de tekst.
4. Klik op het potloodicoon.
5. Vul de vertaling in.
6. Klik op Save translation.
7. Ga verder met het volgende element.

Je hoeft hiervoor dus niet opnieuw de Breakdance Builder te openen.

6. Knoppen en links vertalen

Ook knoppen kunnen via TranslatePress worden vertaald.

Stel dat je een Nederlandse knop hebt:

Plan een afspraak

Selecteer de knop in de TranslatePress-editor.

Je kunt vervolgens de tekst vertalen naar:

Book an appointment

Links

TranslatePress kan naast de tekst van een link ook de URL vertalen. Interne links worden in veel gevallen automatisch naar de juiste taalversie omgezet. Andere links, zoals externe links of links naar bestanden, kunnen handmatig worden aangepast vanuit de Translation Editor.

Controleer daarom bij belangrijke CTA’s altijd zowel:

• de tekst van de knop
• de URL van de knop

7. Afbeeldingen per taal aanpassen

Soms wil je niet alleen de tekst vertalen, maar ook een andere afbeelding gebruiken voor een bepaalde taal.

Bijvoorbeeld:

Nederlandse versie

Een afbeelding met Nederlandse tekst.

Engelse versie

Een afbeelding met Engelse tekst.

TranslatePress ondersteunt het vertalen van afbeeldingen vanuit de Translation Editor. Je kunt hiervoor per taal een andere afbeelding selecteren.

Dit is vooral handig wanneer de afbeelding zelf tekst bevat.

8. Een element tonen of verbergen per taal

Naast het vertalen van content kun je in de combinatie van TranslatePress en Breakdance ook bepalen of een element voor een bepaalde taal zichtbaar is.

Dit kan bijvoorbeeld handig zijn wanneer je een Nederlandse en Engelse CTA naast elkaar hebt.

Selecteer in de editor het betreffende element.

Aan de linkerkant verschijnt de TranslatePress-instelling voor het geselecteerde element.

Daar kun je per taal aangeven of het element:

getoond

of

verborgen

moet worden.

Bijvoorbeeld:

Nederlandse CTA

Nederlands
→ Tonen

Engels
→ Verbergen

Je kunt op dezelfde manier een Engelse variant maken:

Engelse CTA

Nederlands
→ Verbergen

Engels
→ Tonen

Zo kun je binnen dezelfde Breakdance-pagina verschillende elementen gebruiken voor verschillende talen.

Een complete section verbergen

Dit werkt ook voor grotere onderdelen van een pagina.

Je kunt bijvoorbeeld een complete Breakdance-section selecteren en deze alleen voor een bepaalde taal tonen.

Bijvoorbeeld:

Section Nederlands
→ Nederlands: tonen
→ Engels: verbergen

En:

Section Engels
→ Nederlands: verbergen
→ Engels: tonen

Dit is handig wanneer een section inhoud bevat die niet alleen vertaald moet worden, maar inhoudelijk anders is per taal.

9. Verschillende content per taal

Een veelgebruikte werkwijze is om twee varianten van een section te maken.

Bijvoorbeeld:

Section 1
Nederlandse content

en:

Section 2
English content

Vervolgens stel je per section in welke taal deze zichtbaar is.

Op die manier kun je een compleet ander ontwerp of andere inhoud gebruiken voor een bepaalde taal.

Dit is vooral geschikt wanneer de verschillen tussen de taalversies groter zijn dan alleen een vertaalde tekst.

10. Vertalen van header en footer

Een Breakdance-website heeft vaak globale onderdelen zoals:

• Header
• Footer
• Menu
• CTA in de header
• Contactgegevens

Deze onderdelen moeten afzonderlijk worden gecontroleerd.

Open de betreffende pagina met TranslatePress en selecteer het element dat je wilt vertalen.

Omdat TranslatePress de website aan de voorkant vertaalt, kun je ook content uit templates en andere onderdelen van de website tegenkomen in de Translation Editor.

Loop daarom niet alleen de losse pagina’s na, maar controleer ook de globale header en footer.

11. Een pagina volledig vertalen

Een praktische werkwijze is om per pagina te werken.

Bijvoorbeeld:

Pagina 1: Homepage

Controleer:

• Header
• Hero
• Headings
• Teksten
• Buttons
• Afbeeldingen
• CTA’s
• Footer

Pagina 2: Over ons

Controleer:

• Headings
• Teksten
• Buttons
• Afbeeldingen
• CTA’s

Pagina 3: Contact

Controleer:

• Introductietekst
• Formulier
• Contactgegevens
• Buttons
• Footer

Wanneer je een taal selecteert in de TranslatePress-editor, kun je direct zien welke content nog niet vertaald is.

12. Automatisch vertalen

TranslatePress kan naast handmatig vertalen ook automatische vertaling ondersteunen.

Afhankelijk van de ingestelde TranslatePress-versie en diensten kun je hiervoor bijvoorbeeld TranslatePress AI, Google Translate of DeepL gebruiken.

Een praktische werkwijze is:

1. Laat de website automatisch vertalen.
2. Controleer de vertalingen handmatig.
3. Pas belangrijke teksten aan.
4. Controleer CTA’s en commerciële teksten.
5. Controleer links en afbeeldingen.
6. Bekijk de volledige pagina in de doeltaal.

Automatische vertaling is vooral een startpunt. Belangrijke commerciële content moet altijd worden gecontroleerd.

13. Controleren na het vertalen

Bekijk na het vertalen altijd de daadwerkelijke pagina aan de voorkant.

Controleer minimaal:

• Zijn alle teksten vertaald?
• Zijn buttons vertaald?
• Werken de links?
• Zijn afbeeldingen correct?
• Worden de juiste sections getoond?
• Zijn verborgen elementen daadwerkelijk verborgen?
• Zijn header en footer vertaald?
• Werkt de taalwisselaar?
• Zijn formulieren correct?
• Zijn eventuele foutmeldingen en succesmeldingen vertaald?

Test vervolgens de volledige website in iedere beschikbare taal.

14. Handige werkwijze voor Breakdance

Bij een Breakdance-website is het verstandig om eerst de Nederlandse versie volledig af te bouwen.

Daarna:

1. Voeg de benodigde talen toe in TranslatePress.
2. Open de pagina via Translate Page.
3. Kies de gewenste taal.
4. Vertaal de content met de visuele editor.
5. Stel per element eventueel in of het zichtbaar moet zijn.
6. Controleer de links.
7. Controleer afbeeldingen.
8. Controleer header en footer.
9. Controleer de volledige pagina aan de voorkant.
10. Ga daarna verder met de volgende pagina.

Zo voorkom je dat je tijdens het bouwen al meerdere taalversies door elkaar moet beheren.

Samenvatting

Breakdance gebruik je voor het bouwen en vormgeven van de website. TranslatePress gebruik je vervolgens om de gemaakte website visueel te vertalen.

De basiswerkwijze is eenvoudig:

Breakdance → website bouwen

TranslatePress → website vertalen

Voor het vertalen:

1. Ga naar de gewenste pagina.
2. Klik op Translate Page.
3. Selecteer de gewenste taal.
4. Selecteer een tekst of element.
5. Klik op het potloodicoon.
6. Vul de vertaling in.
7. Sla de vertaling op.
8. Controleer de pagina in de nieuwe taal.

Daarnaast kun je via de TranslatePress-instellingen voor geselecteerde Breakdance-elementen bepalen of deze per taal getoond of verborgen moeten worden.

Zo kun je met Breakdance en TranslatePress een meertalige website beheren zonder voor iedere taal een aparte WordPress-pagina te hoeven bouwen.