Andere integratie - Hoe verander ik de positie van de taalswitcher?

In dit artikel lees je hoe je de positie van de Weglot-taalkiezer kunt aanpassen als je een andere integratie gebruikt dan WordPress of Shopify.

1. Gebruik de Switcher Editor

Met de ‘ Switcher Editor ’ kun je de taalschakelaar rechtstreeks in het voorbeeld van je website verplaatsen door deze naar de gewenste positie te slepen en neer te zetten.

Volg onze speciale handleiding om het te gebruiken: Hoe gebruik je de Switcher Editor?

⚠️ De functie ‘ Switcher Editor ’ kan alleen worden gebruikt op websites die live en voor iedereen toegankelijk zijn. De functie kan niet worden gebruikt op websites die met een wachtwoord zijn beveiligd of op lokale websites. De URL van je website moet bovendien worden ingevoerd in je Weglot-dashboard > Instellingen > Algemeen.

2. Gebruik taalkundige aandachttrekker

Je kunt je eigen taalkitems aanmaken in het standaardmenu van je website en deze via taalkoppelingen aan Weglot koppelen.

Je kunt bijvoorbeeld een menu-item ‘Talen’ aanmaken met ‘Engels’ en ‘Frans’ als subitems en de volgende links gebruiken:

• Engels: #Weglot-en
• Frans: #Weglot-fr

De hoofdletter W in Weglot  is vereist.

De waarde na #Weglot-  komt overeen met de taalcode. Bijvoorbeeld: en  is Engels en fr  is Frans.

De code die bij elke beschikbare taal hoort, vindt u in onze lijst met beschikbare talen.

Raadpleeg voor meer informatie over taal-link-hooks onze ontwikkelaarsdocumentatie – Taal-link-hooks.

3. Gebruik de optie `weglot_here`

Je kunt de Weglot-taalkeuzeschakelaar op een bepaalde plek plaatsen door het volgende HTML-element toe te voegen aan je broncode op de plek waar je de schakelaar wilt laten verschijnen:

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

Weglot zal de taalkeuzeknop automatisch binnen dit element weergeven.

4. Gebruik de schakeloptie

Je kunt ook een taalschakelaar in een specifiek element van je website plaatsen met behulp van de switchers  optie in uw Weglot.initialize()  configuratie.

Je Weglot-integratie zou een script moeten bevatten dat er ongeveer zo uitziet:

<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js"></script>

<script>
  Weglot.initialize({
    api_key: "your_api_key",
  });
</script>

 switchers: [
    {
    button_style: {
        full_name: true,
        with_name: true,
        is_dropdown: true,
        with_flags: true,
        flag_type: "circle"
    },
    location: {
        target: ".header-nav", // You'll probably have to change it (see the step below in order to find the correct CSS selector)
        sibling: null
        }
    }
]
});

vervangen "your_api_key"  met je Weglot-API-sleutel.

De belangrijke instelling voor de positie van de taalknop is:

doel: ".header-nav"

De target  De waarde moet de CSS-selector zijn van het element waarin je de taalschakelaar wilt plaatsen.

⚠️ Om de CSS-selector (het "doel") te vinden:

• Klik met de rechtermuisknop op het element waarin je de taalswitcher wilt plaatsen.
• Ga naar "Inspecteren
• Gebruik de pijl linksboven op de console.
• Klik met de rechtermuisknop op het element in de console.
• Kopiëren > Kopieerkiezer
• Plak de code doelveld tussen de dubbele aanhalingstekens

Dus als je het bijvoorbeeld aan je menu wilt toevoegen:

<nav class="menu">

doel: "nav.menu",

Meer informatie over deze methode vindt u in onze documentatie voor ontwikkelaars

5. Aanvullende informatie over Squarespace en Webflow

Squarespace

Als je gebruikmaakt van de ingebouwde Weglot-integratie van Squarespace, wordt de taalschakelaar rechtstreeks vanuit Squarespace beheerd.

Je kunt dit aanpassen via de taalinstellingen van Squarespace. Raadpleeg voor meer informatie de Squarespace-documentatie: Een meertalige website maken met Weglot.

Houd er rekening mee dat de ingebouwde Weglot-integratie van Squarespace momenteel beschikbaar is voor Squarespace-versie 7.1.

Webflow

Als je Webflow gebruikt, kun je ook de Weglot UI Kit van Finsweet gebruiken om een aangepaste taalschakelaar te maken.