Shopify-taalkeuzeschakelaar: hoe je deze toevoegt en aanpast

De taalschakelaar van Shopify is een handige ingebouwde functie voor meertalige webwinkels. Hiermee kunnen klanten je website in hun voorkeurstaal bekijken, waardoor je merk nieuwe internationale markten kan aanboren. Je kunt de functie ook via code aanpassen, zodat deze beter aansluit bij de huisstijl van je merk.

De ingebouwde functie heeft echter wel enkele nadelen, waaronder beperkte aanpassingsmogelijkheden in vergelijking met oplossingen van derden.

Door een speciale Shopify-vertaalapp te integreren, kunnen winkeleigenaren profiteren van extra functies die de functionaliteit verbeteren, de gebruikersbetrokkenheid vergroten en het daadwerkelijke vertaalwerk uit handen nemen. Onze eigen Shopify-vertaalapp Weglot biedt bijvoorbeeld unieke ontwerp- en plaatsingsopties voor de taalschakelaar, waardoor deze aan elke winkelindeling kan worden aangepast. Bovendien doet de app veel meer dan alleen gebruikers de mogelijkheid bieden om van taal te wisselen. Maar daarover later meer.

In dit artikel laten we je zien hoe je optimaal gebruik kunt maken van de ingebouwde taalkeuzeschakelaar van Shopify, waarna we Weglot Shopify zullen bespreken. We gaan daarbij uitgebreid in op de beste werkwijzen voor het vertalen van je webshop en het bieden van een optimale gebruikerservaring.

Belangrijkste punten

• De ingebouwde taalkeuzeschakelaar van Shopify ondersteunt meerdere talen, maar biedt in vergelijking met apps van derden beperkte aanpassingsmogelijkheden.
• Weglot automatische websitevertaling en uitgebreide aanpassingsmogelijkheden voor de taalschakelaar. Het maakt ook volledig handmatige bewerking mogelijk en verbetert meertalige SEO door taalspecifieke URL’s aan te maken en hreflang-tags te implementeren.

Shopify-taalkeuzeschakelaar: overzicht en installatie

Laten we om te beginnen eens kijken naar de ingebouwde taalschakelaar van Shopify. Zoals we al zeiden, stelt deze functie winkeleigenaren in staat om meerdere talen te ondersteunen, waardoor de gebruikerservaring (UX) voor internationale klanten natuurlijk wordt verbeterd.

Zowel handmatige taalselectie als automatische taalomleiding op basis van de browserinstellingen van bezoekers worden ondersteund. Je kunt automatische taalomleiding op basis van de browserinstellingen van bezoekers inschakelen onder Onlinewinkel > Instellingen > Automatische omleiding > Taal, op voorwaarde dat je de betreffende talen hebt gepubliceerd en beschikbaar hebt gemaakt in je doelmarkten.

Als de ingebouwde schakelaar aan je behoeften voldoet, kun je hem als volgt instellen.

Talen en vertaalmethoden instellen

Voordat er überhaupt een taalschakelaar verschijnt, moet je Shopify-winkel wel eerst meerdere talen aanbieden. Als je je vertalingen al hebt ingesteld, kun je gerust doorgaan naar het volgende gedeelte. Zo niet, dan kun je hier lezen hoe je aan de slag gaat…

Ga naar Instellingen > Talen > Taal toevoegen. Kies uit meer dan 20 ondersteunde opties, variërend van Spaans tot Japans. Let op: je moet naast elke taal op ‘Publiceren’ klikken om de vertalingen voor klanten zichtbaar te maken. Als je deze stap overslaat, heeft je nieuwe keuzeschakelaar niets om uit te kiezen.

De ingebouwde app ‘Translate & Adapt’ van Shopify is een mogelijkheid om een meertalige webwinkel op te zetten. Deze app vertaalt je belangrijkste inhoud automatisch en gratis naar 2 talen (8 als je webwinkel gevestigd is in het Verenigd Koninkrijk, Zwitserland of een van de 10 EU-landen), rechtstreeks vanuit het gedeelte ‘Instellingen > Apps’ nadat je je talen hebt toegevoegd.

Om gegevens in bulk te beheren, exporteer je de taalgegevens van je site als CSV-bestand via Instellingen > Talen > Exporteren. Bewerk de vertalingen in bulk en importeer ze vervolgens opnieuw – het belangrijkste is dat je de Liquid-code binnen die accolades {{ }} of {% %} nooit aanraakt. Dat is de thema-engine van Shopify, geen gewone tekst.

Als je de voorkeur geeft aan volledige handmatige controle, kun je met Shopify tot 20 talen beheren (30 bij Shopify Plus). Ga naar Instellingen > Talen > Acties > Vertalingen bestellen om rechtstreeks vanuit je Shopify-dashboard professionele vertaaldiensten te bestellen.

Zodra je talen zijn gepubliceerd en de vertalingen zijn toegepast, kun je aan de slag met de taalkeuzeschakelaar.

De ingebouwde schakelaar van je thema vinden en configureren

De ingebouwde taalschakelaar van Shopify vind je meestal in je thema-editor, onder het gedeelte ‘Koptekst ’ of ‘Voettekst ’. De exacte locatie en aanpassingsmogelijkheden zijn afhankelijk van je thema en versie.

Probeer de volgende stappen eens:

1. Ga in Shopify Admin naar Onlinewinkel > Thema’s > Thema bewerken.
2. Open het gedeelte ‘Koptekst’ of ‘Voettekst’, afhankelijk van waar je de schakelaar wilt weergeven.
3. Zoek naar een instelling met een naam als ‘Taalkeuze inschakelen’, ‘Taalkeuze weergeven’ of ‘Lokalisatie’.
4. Schakel de keuzelijst in en klik op ‘Opslaan’.

Zodra je winkel meerdere gepubliceerde talen aanbiedt in de markt van de klant, zou de taalkeuzeknop de beschikbare taalopties moeten weergeven.

De gratis thema's van Shopify, waaronder Dawn, Craft, Refresh, Sense en Studio, ondersteunen in de huidige versies taalkeuzemenu's in zowel de koptekst als de voettekst. Gratis Online Store 2.0-thema's vanaf versie 9.0.0, evenals thema's uit de Horizon-familie, ondersteunen plaatsing in de koptekst zonder extra code.

Bij premium-thema’s variëren de plaatsingsopties. Impulse biedt bijvoorbeeld de mogelijkheid om de taal te selecteren in de werkbalk in de koptekst en in de voettekst, terwijl andere thema’s wellicht andere instellingen of locaties bieden. Raadpleeg de documentatie van de ontwikkelaar van je thema als je de optie niet kunt vinden.

Oudere thema’s bieden mogelijk minder aanpassingsmogelijkheden. Als je thema de door jou gewenste plaatsing niet ondersteunt, moet je mogelijk de Liquid-sjablonen bewerken, overschakelen naar een nieuwer thema of een vertaalapp gebruiken die eigen instellingen voor de plaatsing biedt.

Hoe de taalkeuzeschakelaar eruitziet, hangt ook af van je thema. Ingebouwde keuzeschakelaars geven doorgaans de namen van de talen weer en passen zich aan aan de lettertypen, kleuren en stijl van je webwinkel. Sommige thema’s bieden extra ontwerpinstellingen, terwijl voor uitgebreidere aanpassingen mogelijk CSS nodig is.

Controleer ook de mobiele lay-out via de thema-voorbeeldweergave van Shopify. Afhankelijk van je thema kan de schakelaar in de voettekst, de koptekst of het mobiele navigatiemenu verschijnen. Zorg ervoor dat klanten deze op kleinere schermen gemakkelijk kunnen vinden en gebruiken, en plaats de land-/regioselectieknop in de buurt als je beide weergeeft.

Hoe voeg ik een taalkeuzemenu toe aan de koptekst van mijn Shopify-winkel?

Je kunt een taalselectieknop aan je Shopify-koptekst toevoegen via de ingebouwde instellingen van je thema, of de Switcher Editor van Weglot gebruiken om een aanpasbare taalselectieknop te plaatsen zonder de code van je thema te bewerken.

Om de standaardtaalkeuzeschakelaar van Shopify toe te voegen, zoals eerder uitgelegd, ga je naar Shopify Admin > Onlinewinkel > Thema’s > Thema bewerken, open je het gedeelte ‘Koptekst’, zoek je naar ‘Taalkeuzeschakelaar inschakelen’ of een soortgelijke instelling, schakel je de keuzeschakelaar in en klik je vervolgens op ‘Opslaan’.

Als je Weglot gebruikt, ga dan naar Weglot Dashboard > Instellingen > Taalkeuzeschakelaar > Schakelaareditor. Sleep de schakelaar naar de gewenste plek in de koptekst en klik op ‘Opslaan’. Kies een plek die op alle pagina’s van je winkel op dezelfde plek staat, zodat de schakelaar op zijn plaats blijft terwijl klanten door de winkel navigeren.

Voor een nauwkeurigere positionering ondersteunt Weglot ook deze HTML-plaatshouder:

<div id="weglot_here"></div>

Je kunt het toevoegen aan een Custom Liquid-sectie of -blok in het koptekstgedeelte van je thema, indien dit wordt ondersteund, of het invoegen in het betreffende themabestand. Weglot geeft vervolgens de schakelaar weer op de plek waar de plaatshouder staat. De exacte plaatsing hangt af van de lay-out van je thema.

Test de schakelaar na de installatie altijd zowel op desktop als op mobiel, inclusief product- en collectiepagina’s. Test ook je afrekenproces, want Shopify beheert het afrekenproces apart van de koptekst van je webshop; als je daar een schakelaar toevoegt, wordt deze dus niet automatisch ook aan het afrekenproces toegevoegd. Als je de Shopify Markets-integratie vanWeglot gebruikt, regelt Shopify de taal van het afrekenproces op basis van de eerdere keuze van de klant, en verschijnt de schakelaar ‘ Weglot ’ zelf niet tijdens het afrekenen.

De Switcher toevoegen met Liquid-code

Als je Shopify-thema niet de plaatsing of ontwerpopties voor de taalselector biedt die je nodig hebt, kun je met Liquid een aangepaste selector maken. Hiervoor moet je de code van je thema bewerken, dus maak eerst een back-up voordat je verdergaat.

Om de taalkeuzeschakelaar van Shopify in te stellen en aan te passen, moet je de volgende stappen volgen:

1. Ga vanuit je Shopify-beheerderspagina naar Instellingen > Talen en voeg de talen toe die je wilt ondersteunen. Zorg ervoor dat deze talen beschikbaar zijn in je doelmarkten en dat je de benodigde vertalingen hebt toegevoegd.
2. Ga naar Onlinewinkel > Thema’s en klik op ‘Code bewerken’ in het menu met de drie puntjes van je thema.
3. Zoek het bestand header.liquid in de map Sections. Welk bestand het precies is en waar je de code precies moet invoegen, hangt af van je thema. Controleer daarom de structuur van je thema voordat je wijzigingen aanbrengt.
4. Zoek een geschikte plek in het bestand header.liquid (meestal in de buurt van het navigatiemenu) en plak het volgende snippet:

{% if localization.available_languages.size > 1 %}
  <div class="page-width custom-language-topbar">
    {% form 'localization', id: 'header-language-form' %}
      <div class="shopify-language-switcher">
        <label for="header-language-selector">Language</label>

        <select
          id="header-language-selector"
          name="language_code"
        >
          {% for language in localization.available_languages %}
            <option
              value="{{ language.iso_code }}"
              {% if language.iso_code == localization.language.iso_code %}selected{% endif %}
            >
              {{ language.endonym_name | escape }}
            </option>
          {% endfor %}
        </select>

        <button type="submit">Apply</button>
      </div>
    {% endform %}
  </div>
{% endif %}

De plaatsing van je Liquid-code bepaalt waar de taalschakelaar op je webshop wordt weergegeven. Als je deze bijvoorbeeld in het navigatiegedeelte van je koptekst plaatst, wordt deze mogelijk naast je menu weergegeven, terwijl je door deze in een aparte container boven de navigatie te plaatsen een aparte taalselectiebalk kunt creëren.

Deze code maakt gebruik van het lokalisatieformulier van Shopify om de talen op te halen die voor klanten beschikbaar zijn. Elke taal wordt weergegeven onder de eigen naam, zoals ‘Français’ voor het Frans, en de huidige taal wordt gemarkeerd als geselecteerd. Klanten kiezen een taal uit de vervolgkeuzelijst en klikken op ‘Toepassen’ om over te schakelen.

Als je thema op dezelfde plek al een taalkeuzeschakelaar weergeeft, schakel deze dan uit via de thema-editor om dubbele weergaven te voorkomen.

5. Je kunt CSS gebruiken om de uitlijning, kleuren, spatiëring en randen van de schakelaar aan te passen. Open in de thema-editor ‘Thema-instellingen’ > ‘Aangepaste CSS’ en voeg het volgende voorbeeld toe:

.custom-language-topbar {
  display: flex;
  justify-content: flex-end;
  padding-top: 8px;
  padding-bottom: 8px;
}

.custom-language-topbar .shopify-language-switcher {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.shopify-language-switcher select {
  font: inherit;
  font-size: 16px;
  color: #007bff;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 8px;
}

.shopify-language-switcher select:hover {
  border-color: #555;
}

.shopify-language-switcher select:focus-visible {
  outline: 2px solid #0056b3;
  outline-offset: 2px;
}

6. Klik na het aanbrengen van je wijzigingen op ‘Opslaan’ om ze toe te passen. De taalkeuzeknop zou nu in je webwinkel moeten verschijnen, conform je instellingen. Bekijk een voorbeeld van je webwinkel op desktop en mobiel.

Shopify-winkels verbeteren met de taalschakelaar Weglot

Weglot is een door AI aangestuurde tool voor websitevertaling die een taalschakelaar aan je Shopify-winkel toevoegt zonder dat je iets aan je thema hoeft aan te passen. Hoewel de standaard taalschakelaar van Shopify weliswaar werkt, bieden speciale Shopify-vertaalapps zoals Weglot meer aanpassingsmogelijkheden bieden, samen met extra vertaalfuncties voor Shopify voor wie de winkelervaring voor zijn internationale klanten echt wil lokaliseren.

In tegenstelling tot de taalkeuzeschakelaar van Shopify vertaalt Weglot 100% van de inhoud van de website vanuit een keuze uit meer dan 110 talen, inclusief afrekenpagina’s, e-mailmeldingen en SEO-metadata, en optimaliseert deze voor zoekmachines.

Met Weglot profiteert uw gehele Shopify-winkel van automatische vertalingen, waardoor uitbreidingsprojecten in een stroomversnelling komen. In vergelijking met het inhuren van afzonderlijke vertalers voor elke taal zorgt de automatisering Weglotervoor dat nieuwe taalversies aanzienlijk sneller op de markt kunnen worden gebracht.

De mogelijkheden Weglotreiken echter verder dan geautomatiseerde vertalingen. Met Weglot krijgt u volledige bewerkingscontrole over de vertaalde inhoud op uw website. Daarnaast kunt u via het platform rechtstreeks professionele vertalers inhuren.

Je kunt ook direct vertalingen genereren die helemaal bij je merk passen met het AI-vertaalmodel van Weglot. Het leert van je instructies, woordenlijst en eerdere handmatige vertalingen, zodat het je direct contextgevoelige vertalingen kan bieden die helemaal bij je stijl passen.

Weglot kan Weglot worden geïntegreerd met de bestaande functies van Shopify en populaire apps van derden, waaronder aanpassingsmogelijkheden voor thema’s zoals Dawn en Prestige. Dit bespaart je het gedoe van het beheren van meerdere winkels of handmatige vertalingen, aangezien je naar behoefte talen kunt toevoegen, publiceren, de publicatie ervan intrekken of verwijderen.

Weglot doet meer dan alleen vertalen: meertalige SEO-voordelen vormen de kern van de app. Het platform maakt automatisch subdomeinen of submappen aan voor elke taalversie en implementeert hreflang-tags, waardoor je site wordt geoptimaliseerd voor lokale zoekmachines. Bovendien Weglot onze Visual Editor kunt u vertalingen eenvoudig aanpassen, zodat u ze precies kunt afstemmen op de stijl van uw merk.

En het mooiste is: het instellen van Weglot het aanpassen van je taalschakelaar is binnen enkele ogenblikken gepiept! Laten we eens kijken.

Weglot instellen Weglot je Shopify-winkel

Het instellen van Weglot je Shopify-winkel is heel eenvoudig. Hier volgt een handleiding om je op weg te helpen:

1. Ga eerst naar de Shopify App Store:

• Typ in de zoekbalk Weglot en zoek de Weglot .
• Klik op ‘Installeren’ en volg de instructies om het aan je winkel toe te voegen.

2. Nadat je de app hebt geïnstalleerd, moet je een account aanmaken:

• Open de Weglot vanuit je Shopify-dashboard.
• Voer je e-mailadres in en kies een wachtwoord.

3. Stel je taalinstellingen in:

• Kies vervolgens je oorspronkelijke taal (de taal van je Shopify-winkel).
• Kies vervolgens de doeltalen waarin u uw inhoud wilt laten vertalen.

Nadat je je talen hebt geselecteerd, Weglot automatisch alle inhoud van je webwinkel, inclusief metagegevens en inhoud uit apps van derden. Dankzij de automatische detectie hoef je de inhoud niet handmatig te verzamelen voor vertaling, want Weglot dat allemaal voor je!

Vervolgens wordt uw website direct vertaald met behulp van toonaangevende AI-vertaaltechnologie en weergegeven in taalsubmappen of subdomeinen, afhankelijk van de structuur die u hebt gekozen in het dashboard van Weglot .

De taalschakelaar Weglot aanpassen: ontwerp- en plaatsingsopties

De taalschakelaar van Weglotbiedt uitgebreide aanpassingsmogelijkheden, zodat je deze kunt afstemmen op de huisstijl van je webwinkel voor een uiterst professioneel eindresultaat. Zo kun je de taalschakelaar aanpassen:

1. Open de editor voor de visuele taalschakelaar: Ga naar je Weglot en ga naar Instellingen > Taalschakelaar.
2. Uiterlijk wijzigen: Kies uit verschillende weergavevormen, zoals vervolgkeuzemenu’s, knoppen of vlaggetjes, om taalopties weer te geven. Bijvoorbeeld:
   • Gebruik vlaggen om dingen snel te herkennen.
   • Kies voor knoppen om de weergave meer te laten opvallen.

3. Positie aanpassen: Je kunt de schakelaar op belangrijke plekken plaatsen, zoals in de koptekst, de voettekst of de zijbalk, afhankelijk van wat het beste bij je lay-out past.
4. Kleuren en stijlen aanpassen: Pas de kleuren en stijlen aan in de Weglot , zodat ze aansluiten bij de huisstijl van je winkel.

Belangrijk is dat de taalschakelaar eenvoudig kan worden verplaatst zonder dat er aanpassingen aan het thema nodig zijn, waardoor deze op alle pagina’s van je winkel toegankelijk en gebruiksvriendelijk blijft. Voor geavanceerde plaatsingsopties kun je ons onderstaande gedeelte raadplegen over het oplossen van veelvoorkomende uitdagingen bij de lokalisatie van Shopify-winkels.

Geavanceerde aanpassingen: programmeertips voor ontwikkelaars

Voor ontwikkelaars die hun Shopify-winkels met Weglot willen verbeteren, kan maatwerk de sleutel zijn tot het creëren van een op maat gemaakte meertalige ervaring. Dankzij de flexibiliteit Weglotkunnen ontwikkelaars meertalige ervaringen op maat creëren, terwijl de website gebruiksvriendelijk blijft voor gebruikers zonder technische kennis.

Hier volgen enkele tips voor het programmeren waarmee je rekening kunt houden:

CSS gebruiken om het uiterlijk van de taalschakelaar aan te passen

Ontwikkelaars kunnen stijlelementen zoals de achtergrondkleur, de lettergrootte en de opmaak aanpassen aan de huisstijl van de winkel. Bijvoorbeeld:

select {    
background-color: #f0f0f0;    
 border: 2px solid #007bff;    
 border-radius: 5px;    
 padding: 10px;
}

JavaScript implementeren voor aangepaste functionaliteit

Ontwikkelaars kunnen JavaScript gebruiken om bepaalde acties te activeren wanneer een taal wordt geselecteerd, zoals het bijwerken van andere elementen op de pagina of het bijhouden van taalwijzigingen voor analytische doeleinden. Je zou bijvoorbeeld een gebeurtenislistener kunnen implementeren:

document.addEventListener('DOMContentLoaded', function() {
var languageSelector = document.querySelector('select[name="language_code"]');    
 if (languageSelector) {        
  languageSelector.addEventListener('change', function(event) {            
    // Custom functionality here            
     // For example, track language change event            
     console.log('Language changed to: ' + event.target.value);
   });    
 }
});

Weglot implementeren Weglot naadloze paginaovergangen tussen talen

Een van de belangrijkste functies Weglotis het automatisch aanmaken van taalspecifieke URL’s, zoals example.com/fr voor de Franse versie van uw website. Een degelijke URL-structuur zorgt ervoor dat zoekmachines elke taalversie kunnen indexeren, wat uw inspanningen op het gebied van meertalige SEO ten goede komt.

Weglot klanten Weglot tijdens hun winkelervaring eenvoudig van taal te wisselen, of ze nu door producten bladeren of afrekenen. Wanneer een klant overschakelt van bijvoorbeeld een Engelstalige productpagina naar de (bijvoorbeeld Spaanstalige) tegenhanger daarvan, verloopt dit soepel zonder dat hij zijn plaats in het aankooptraject kwijtraakt. Dergelijke functies kunnen van invloed zijn op belangrijke statistieken zoals de verblijftijd op de site en conversiepercentages, waardoor de klanttevredenheid toeneemt en uiteindelijk wereldwijde groei wordt gestimuleerd.

Om een voorbeeld te geven: Everyone.org – dat Weglot gebruikte Weglot een meertalige website in 12 talen te maken – zag het totale aantal bezoekers met 40% stijgen, waarbij Franstalige gebruikers een conversieratio hadden die bijna het dubbele bedroeg van de gemiddelde conversieratio op de hele site.

Meertalige SEO optimaliseren en de consistentie van pagina’s waarborgen

Meertalige SEO zorgt ervoor dat uw producten vindbaar zijn voor gebruikers die in verschillende talen zoeken, waardoor het online verkeer toeneemt. Een fundamenteel aspect van meertalige SEO is het hebben van een goede URL-structuur, en het gebruik van submappen helpt zoekmachines om pagina’s in verschillende talen te herkennen en te rangschikken.

Hreflang-tags spelen een belangrijke rol in dit proces doordat ze zoekmachines informeren over de taal en de regionale gerichtheid van uw pagina’s. Dit helpt gebruikers naar de meest relevante versie van uw website te leiden.

Vertaalde metagegevens, waaronder titeltags en beschrijvingen, dragen bovendien bij aan een betere zichtbaarheid in zoekresultaten. Weglot een groot deel van het technische SEO-werk, door automatisch taalspecifieke URL’s aan te maken en hreflang-tags te implementeren zonder dat er handmatige tussenkomst nodig is.

Bovendien kunnen winkeleigenaren dankzij Visual Editor het taalwoordenboek Weglotde consistentie van de vertalingen waarborgen.

Om nog een stapje verder te gaan met meertalige SEO, kunnen eigenaren van Shopify-winkels het volgende doen:

• Voer voor elke doelmarkt een lokaal zoekwoordonderzoek uit.
• Zorg ervoor dat alle inhoud, inclusief metagegevens, correct wordt vertaald.
• Controleer vertalingen regelmatig om rekening te houden met veranderingen in taaltrends.

Vergeet niet dat effectieve meertalige SEO kan leiden tot meer kansen op de markt! Na de implementatie van Weglot voor meertalige optimalisatie zag Ron Dorff, een Shopify-winkel, een ongelooflijke stijging van 400% in het aantal websitebezoeken.

Veelvoorkomende uitdagingen bij de lokalisatie van Shopify-webwinkels overwinnen

Het lokaliseren van Shopify-winkels brengt een aantal specifieke uitdagingen met zich mee, maar Weglot effectieve oplossingen om dit proces voor u te vergemakkelijken.

Om de positie van de Weglot op een Shopify-website te wijzigen, kun je een van de volgende vier methoden gebruiken:

1. Functie ‘Switcher Editor’

Gebruik de Switcher Editor om de taalschakelaar via slepen en neerzetten rechtstreeks in het live-voorbeeld van je website te plaatsen. Voor deze methode moet je website live zijn.

2. Aan een menu toevoegen

Maak een aangepaste taalschakelaar in je hoofdmenu door deze te koppelen aan Weglot . Ga naar Shopify Admin > Online winkel > Navigatie en voeg menu-items toe voor elke taal in de indelingWeglot(bijv.Weglot voor Engels). Je kunt ook een vervolgkeuzemenu voor talen maken.

3. Optie Weglot

Voeg het volgende snippet op de gewenste plaats snippet je Theme.liquid-bestand snippet :

<div id="weglot_here"></div>

Deze code plaatst de taalschakelaar op de plek waar je de code invoegt, waarmee veelvoorkomende beperkingen bij de plaatsing – die in communityforums aan de orde zijn gekomen – worden verholpen.

4. Schakeloptie

Integreer de schakelaar handmatig door je Weglot in weglot.liquid aan te passen. Voeg de optie `Switchers` toe en geef de CSS-selector op voor de plek waar je de schakelaar wilt weergeven:

Weglot.initialize({  
api_key: "YOUR_API_KEY",  
 switchers: [{     
  location: { target: ".header-nav" }   
 }]
});

Zorg ervoor dat je .header-nav vervangt door de CSS-selector van het gewenste element.

Door Weglot te gebruiken, profiteert u bovendien van de volgende voordelen op het gebied van lokalisatie:

• Vertaling van dynamische inhoud: Weglot vertaalt door JavaScript gegenereerde inhoud en via AJAX geladen elementen Weglot , waardoor alle dynamische inhoud wordt vastgelegd en vertaald.
• Meertalige SEO voor Shopify: Weglot de implementatie van hreflang-tags en maakt taalspecifieke sitemaps. Dit vormt een aanvulling op de ingebouwde SEO-functies van Shopify, waardoor zoekmachines gebruikers de juiste taalversie kunnen aanbieden.

• Shopify-specifieke elementen vertalen: Weglot verzorgt de vertalingen voor je hele winkel, inclusief afrekenpagina’s, e-mailmeldingen en metavelden, en omzeilt daarmee de beperkingen die in de documentatie van Shopify worden beschreven.

• Vertaalworkflows optimaliseren: met de vertaalgeheugen- en woordenlijstfuncties Weglotkunt u de consistentie binnen een uitgebreide productcatalogus waarborgen. Zo wordt ervoor gezorgd dat termen op een uniforme manier worden vertaald, waardoor uw merkboodschap in alle talen samenhangend blijft.

Vergelijking tussen Weglot de standaardtaalkeuzeschakelaar van Shopify

Shopify biedt gebruikers de basisfuncties die nodig zijn om hun webwinkels in meerdere talen te vertalen, maar er zijn wel enkele beperkingen.

Weglot daarentegen een uitgebreide vertaaloplossing en pakt de beperkingen van Shopify direct aan. Daardoor is het platform een geschiktere keuze voor gebruikers die op zoek zijn naar een hands-off aanpak voor het beheer van meertalige content.

Taalbarrières overwinnen: implementeer Weglot je Shopify-winkel

Zoals we hebben gezien, Weglot unieke voordelen voor Shopify-webwinkels, waardoor het de ideale oplossing is om taalbarrières online te overwinnen. Met de taalschakelaar Weglotkrijg je extra aanpassingsmogelijkheden om de gebruikerservaring te verbeteren, terwijl de Visual Editor contextgebonden vertalingen Visual Editor , zodat je de inhoud waar nodig kunt verfijnen. Je kunt zelfs rechtstreeks vanuit het dashboard professionele vertalingen aanvragen voor nog meer nauwkeurigheid.

Weglot met populaire Shopify-apps, waaronder slimme zoekfuncties en fotogalerijen, waardoor je winkel in meerdere talen volledig functioneel blijft. Bovendien maakt ons platform taalspecifieke subdomeinen of submappen aan, wat je SEO-inspanningen aanzienlijk versterkt.

Het beste van alles is dat Weglot compatibel Weglot met alle contentmanagementsystemen, wat betekent dat je, als je Shopify verlaat, toch van de voordelen van Weglot kunt blijven profiteren.

Begin vandaag nog met je gratis proefperiode van 14 dagen bij Weglot en geniet binnen enkele minuten van een meertalige website!

Veelvoorkomende problemen en snelle oplossingen

Taalkeuzeschakelaars verdwijnen soms na een thema-update, het installeren van een app of het aanpassen van de lay-out. Deze problemen zijn meestal terug te voeren op je thema-instellingen of de plaatsing van de schakelaar. Laten we de vier meest voorkomende problemen eens oplossen.

1. Waarom heb ik twee taalschakelaars?

Als je twee switcher-functies ziet, betekent dit meestal dat zowel de standaard switcher van Shopify als de versie van je app (zoals Weglot) tegelijkertijd actief zijn. Het kan ook zijn dat je meer dan één switcher van Weglot hebt geconfigureerd.

Open eerst Shopify Admin > Online winkel > Thema’s > Thema bewerken. Controleer of de standaardtaalkeuzeschakelaar van Shopify in de kop- en voettekst staat; schakel deze uit als je Weglot gebruikt, en sla je wijzigingen op. De exacte instelling hangt af van je thema. Laat bovendien de land-/regiokeuzeschakelaar ingeschakeld als klanten deze nodig hebben om hun markt te kiezen.

Als beide schakelaars bij Weglot horen, ga dan naar Weglot Dashboard > Instellingen > Taalwisselaar > Schakelaareditor. Controleer welke schakelaars zijn geconfigureerd en of ze zijn ingesteld om bij dezelfde schermformaten te verschijnen. Weglot ondersteunt aparte schakelaars voor desktop en mobiel, dus zorg ervoor dat ze niet onbedoeld samen worden weergegeven.

Als je taalkoppelingen aan je Shopify-navigatie hebt toegevoegd, controleer dan of deze naast de standaardtaalkeuzeknop van Weglot worden weergegeven. Verwijder eventuele overbodige menu-items als je ze niet allebei nodig hebt.

Raadpleeg de officiële Shopify-documentatie over de taalschakelaar ( Weglot ) voor meer informatie over het plaatsen en initialiseren van een aangepaste taalschakelaar.

2. Waarom is mijn taalkeuzeschakelaar verdwenen na een thema-update?

Als je taalschakelaar verdwijnt na het bijwerken van je Shopify-thema, betekent dat niet per se dat je vertalingen kwijt zijn. Het probleem kan te maken hebben met de instellingen van de taalschakelaar of de plaatsing ervan in het bijgewerkte thema.

Test een van de vertaalde URL’s van je winkel, bijvoorbeeld yourstore.com/fr/, als je in je configuratie gebruikmaakt van taalsubmappen. Als de pagina vertaalde inhoud weergeeft maar de taalknop ontbreekt, ligt het probleem mogelijk bij de weergave van de taalknop en niet bij de vertalingen zelf.

Als je de ingebouwde taalkeuzeschakelaar van Shopify gebruikt, controleer dan nogmaals of je extra talen nog steeds zijn gepubliceerd onder Instellingen > Talen. Als ze niet als ‘Gepubliceerd’ zijn gemarkeerd, worden ze nergens weergegeven.

Als je Weglot gebruikt:

1. Controleer of ‘ Weglot ’ is ingeschakeld: ga naar Online Store > Thema’s > Thema bewerken > App-integraties, zoek ‘ Weglot ’ en schakel deze in als deze is uitgeschakeld. Klik op ‘Opslaan’ en controleer je webshop.
2. De positie van de schakelaar opnieuw instellen: Als deze nog steeds ontbreekt, ga dan naar Weglot Dashboard > Instellingen > Taalkeuzeschakelaar > Schakelaareditor. Selecteer onder ‘Positie’ de optie ‘Terugzetten naar standaardpositie’. Hierdoor wordt de schakelaar weer in de rechteronderhoek geplaatst.

3. Kies indien nodig een nieuwe positie: als de schakelaar opnieuw verschijnt, werkt de vorige locatie mogelijk niet meer met je bijgewerkte thema. Gebruik de Switcher-editor om de schakelaar naar een nieuwe positie te slepen binnen een element dat overal in je winkel consistent wordt weergegeven, en klik vervolgens op ‘Opslaan’.

Als je de schakelaar van Weglot handmatig aan de code van je thema hebt toegevoegd, controleer dan of je aangepaste plaatsing bij de update behouden is gebleven. Als je bijvoorbeeld eerder gebruikmaakte van <div id="weglot_here"></div>, controleer of het nog steeds op de beoogde plek staat. Als het is verwijderd, zet het dan terug vanuit je vorige themaversie, nadat je hebt gecontroleerd of de plaatsing compatibel is met de bijgewerkte lay-out.

Controleer je webshop ook zowel op de desktop als op mobiele apparaten. Als de schakelaar wel werkt op de desktop maar niet op mobiele apparaten, kan dit te wijten zijn aan de instellingen voor de weergave op basis van schermgrootte of aan de mobiele lay-out van je thema. Dit is wat we hierna gaan bespreken.

3. Waarom wordt de taalschakelaar niet weergegeven op mobiele apparaten?

Als je Shopify-taalkeuzeschakelaar op de desktop wel wordt weergegeven, maar op mobiele apparaten niet, kan het zijn dat deze wordt verborgen door de mobiele lay-out van je thema of dat deze zo is ingesteld dat hij alleen op grotere schermen wordt weergegeven.

Als je de ingebouwde schakelaar van Shopify gebruikt, ga dan naar Onlinewinkel > Thema’s > Thema bewerken en selecteer het mobiele voorbeeld. Controleer of de taalkiezer in de voettekst, de koptekst of het mobiele menu verschijnt, afhankelijk van je thema. Als deze ontbreekt, controleer dan of de betreffende instelling voor de taalkiezer is ingeschakeld. Bij sommige thema’s is mogelijk aanvullende aanpassing nodig om deze op de door jou gewenste locatie op mobiele apparaten weer te geven.

Als je Weglot gebruikt:

1. Open het dashboard vanWeglot > Instellingen > Taalkeuzeschakelaar > Schakelaareditor.
2. Selecteer je huidige switcher in het dropdown-menu in de linkerbovenhoek. Controleer onder ‘Gedrag’ > ‘Weergeven op specifieke schermformaten’ of deze is ingesteld om op mobiele apparaten te worden weergegeven.
3. Als je een andere mobiele lay-out wilt, selecteer je de mobiele weergave linksonder in de editor, klik je op de +-knop om een aparte schakelaar aan te maken en sleep je deze naar de gewenste positie.
4. Klik op ‘Opslaan’ en controleer vervolgens of je desktop- en mobiele schakelaars op de beoogde schermformaten worden weergegeven.

Als er in de koptekst van je mobiele versie niet genoeg ruimte is, kun je de taalknoppen ook aan je navigatiemenu voor mobiele apparaten toevoegen. Ga naar Shopify-beheer > Inhoud > Menu's, selecteer het menu dat door je mobiele navigatie wordt gebruikt en voeg voor elke taal een menu-item toe volgens de linkopmaak van Weglot, bijvoorbeeld #Weglot-nl voor Engels of #Weglot-fr voor Frans. Je kunt deze links ook groeperen onder een uitklapmenu ‘Talen’ als je thema dit ondersteunt.

Als de schakelaar nog steeds ontbreekt, controleer dan of deze door aangepaste CSS op kleinere schermen wordt verborgen of dat hij zich in een navigatie-element bevindt dat alleen op de desktop wordt weergegeven. Door de schakelaar naar een zichtbare, vaste plek te verplaatsen, kan het probleem mogelijk worden opgelost.

4. Werkt de switcher na het verversen wel, maar niet bij het eerste laden van de pagina?

Als je taalschakelaar in Weglot pas verschijnt nadat je de pagina hebt vernieuwd, kan het probleem te maken hebben met de manier waarop je Shopify-thema inhoud laadt of met de plaats waar de schakelaar is geplaatst.

Probeer deze oplossingen eens:

1. Stel de positie van de schakelaar opnieuw in, net zoals we in de tweede opgave hierboven hebben gedaan. Als de schakelaar nu altijd correct wordt weergegeven, ligt het probleem mogelijk bij de eerdere plaatsing ervan. Weglot raadt aan om de schakelaar in een element te plaatsen dat op alle pagina’s van je webwinkel aanwezig is.
2. Controleer de paginaovergangen van je thema. Sommige Shopify-thema’s maken gebruik van animaties of AJAX-navigatie om tussen pagina’s te schakelen zonder deze volledig opnieuw te laden, wat de werking van Weglot kan verstoren. Als je thema deze instellingen biedt, ga dan naar Onlinewinkel > Thema’s > Thema bewerken > Thema-instellingen en zoek naar ‘Prestaties’ of ‘Animaties’. Weglot raadt aan om ‘Sport’ te selecteren in plaats van ‘Ludicrous’ en ‘Animaties tussen pagina’s’ uit te schakelen, indien deze opties beschikbaar zijn.
3. Controleer eventuele aangepaste code voor de switcher. Als je de plaatsing van Weglot handmatig hebt aangepast, controleer dan of de gekozen locatie bestaat op het moment dat de switcher wordt geladen. Een koptekst of navigatie-element dat pas later verschijnt, kan extra integratiewerk vereisen.

Test ten slotte je webwinkel in een apart browservenster: begin op de startpagina en ga vervolgens naar verschillende product- en collectiepagina’s. Als het probleem zich blijft voordoen, neem dan contact op met de Weglot -helpdesk en vermeld daarbij de URL van je webwinkel, de naam van het thema en de stappen die nodig zijn om het probleem te reproduceren.