Voor bedrijven en/of instellingen die internationaal opereren of een internationals doelgroep hebben is een website in meerdere talen onmisbaar. Met de gratis plugin qTranslate voor WordPress kun je eenvoudig een WordPress website in meerdere talen opzetten. Hoe je de plugin installeert, inricht en gebruikt, laat ik in deze post zien.
1. Installeren van de plugin qTranslate
De plugin qTranslate kan gewoon geïnstalleerd worden vanuit WordPress zelf. Ga naar Plugins en kies nieuwe plugin. Zoek op qtranslate en het eerste resultaat is de juiste plugin.
Kies voor installeren en vervolgens voor Activeren. De plugin is nu geactiveerd en je kunt de plugin nu gaan inrichten naar eigen smaak.
2. Instellen van de plugin qTranslate
Na het activeren van de plugin is onder Instellingen het kopje Talen toegevoegd. Hier kun je alle instellingen van de plugin bekijken en aanpassen. Ook worden onderin het WordPress dashboard de geactiveerde talen getoond. Door één van de talen te kiezen verandert de hele WordPress backend in de gewenste taal.
Schakel onder Instellingen – Talen alle talen in die je op je website wilt gebruiken en schakel de overige talen uit. Kies, als je dit gedaan hebt, bovenin het scherm de standaard taal en sla de wijzigingen op.
Nu je de talen hebt gekozen die je op de website wilt gebruiken, wil je de bezoekers nog de mogelijkheid geven om hun gewenste taal te kiezen. Hiervoor kun je de widget qtranslate Language Chooser gebruiken. Ga hiervoor naar Weergave – Widgets en voeg de widget qTranslate Language Chooser toe aan de sidebar waar je de widget wilt laten zien. Bij de widget heb je de mogelijkheid om alleen tekst, alleen een plaatje, tekst en een plaatje of een Dropdown box te laten zien. Ik vind zelf de optie van alleen plaatjes (vlaggetjes) een mooie optie. Als je deze optie gekozen hebt, worden de vlaggetjes in een lijst met bullets onder elkaar getoond. Dit is niet erg fraai. Om de vlaggetjes naast elkaar te laten zien moet je een kleine aanpassing in je style.css bestand maken. Voeg hiervoor helemaal onderin het bestand de volgende regels toe:
/* qtranslate language chooser
.qtrans_language_chooser { list-style-type:none }
.qtrans_language_chooser li { float:left; margin-right:15px }
De vlaggetjes in de widget worden nu mooi naast elkaar getoond met voldoende tussenruimte.
3. Gebruiken van de plugin qTranslate bij het maken van pagina’s en berichten
Nu je de installatie en de inrichting van de plugin voor elkaar hebt, kun je de plugin gaan gebruiken. Het gebruik van de plugin spreekt eigenlijk voor zich. Bij alle pagina’s en berichten heb je de optie om de titel en de inhoud van het bericht in de geactiveerde talen in te voeren. De titels worden onder elkaar getoond in de verschillende talen en bij het blok met de inhoud staan de talen als verschillende tabjes boven het venster waar je de inhoud van de pagina of het bericht typt.
Conclusie
De plugin qTranslate is redelijk makkelijk in te richten en is erg eenvoudig in gebruik. Vooral bij kleinere website werkt dit prima. De plugin WMPL schijnt ook erg goed te werken, maar hier heb ik zelf geen ervaring mee. Het voordeel van qTtanslate ten opzichte van WMPL is dat qTranslate gratis is. Voor eenvoudige website kan ik de plugin qTtanslate dan ook van harte aanbevelen!
Welke ervaringen heb jij met de plugin qTranslate of andere plugins die het mogelijk maken om een WordPress website in meerdere talen op te zetten?
Hai Lars, Ik heb Qtranslate geïnstalleerd, maar nu zie ik alleen engels en geen nederlandse vlag. Als ik dit toevoeg dan zegt hij dan NL al is toegevoegd. Wat kan ik nu doen?
het is ondertussen gelukt.
Dat is snel. Mooi dat het gelukt is!
Gr.
Lars
Hoi,
Wat erg jammer is van qTranslate, dat als je WordPress upgrade qTranslate plots niet meer werkt, je moet dus wachten tot de ontwikkelaar de plugin heeft bijgewerkt..
Nu zit WordPress al 5 weken op 3.9.. dus je zit nu 5 weken zonder werkende qTranslate.
Dus bij de volgende WordPress upgarde moet je eerst wachten tot de ontwikkelaar de plugin heeft bijgewerkt, daarna kun je pas en WordPress en de Plugin bijwerken. Erg onhandig.
Hoi Harry,
Ja dat is inderdaad een nadeel. Hiervoor ben je afhankelijk van de ontwikkelaar en bij een gratis plugin wil dit nog wel eens wat langer duren. qtranslate is 26-01-2014 voor het laatst bijgewerkt.
Om problemen te voorkomen, zul je met het updaten van WordPress moeten wachten tot de plugin is bijgewerkt, maar 5 maanden wachten is niet erg aantrekkelijk. Een alternatief is het werken met een betaalde plugin, zoals WPML. Bij een betaalde plugin mag je verwachten dat deze sneller wordt bijgewerkt.
Hoi Lars,
Ik krijg van die puntjes boven de vlaggen is het mogelijk om die te verwijderen.
Qtranslate werkt nog niet mocht je een nog een gratis oplossing hebben. Anders heb ik gewoon geduld.
Stel je voor dat ik de gehele site wil vertalen dus dat de gebruiker maar een keer op het vlagje hoofd te drukken, is die mogelijkheid er ook. In elk geval bedankt voor je goede uitleg. Zoals je al raad be ik nieuw met wordpress.
Hoi Walter,
De puntjes boven de vlaggetjes zijn waarschijnlijk de opsommingstekens. De “list-style-type:none” werkt dan niet. Misschien moet je achter deze regel in de stylesheet dan !important zetten, zodat je zeker weet dat deze regel gebruikt wordt.
Ik heb al een tijdje niet meer met qtranslate gewerkt, maar het zal nog steeds moeten kunnen dat je met het vlaggetje naar de taal van die vlag gaat en dat je dan de hele website in die taal ziet. Mits al je pagina’s en berichten ook in die taal aanwezig zijn.
Succes verder met WordPress (en qtranslate) !
Dag Lars,
Allereerst, perfecte uitleg van deze handige plug-in.
Ik probeer die vlaggetjes naast elkaar te krijgen met jouw tip:
/* qtranslate language chooser
.qtrans_language_chooser { list-style-type:none }
.qtrans_language_chooser li { float:left; margin-right:15px }
Het gewenst effect wordt echter niet bereikt… Enig idee?
Hallo Wim,
Het kan zijn dat deze regels overruled worden door andere regels in het .css bestand. Dit kun je dan oplossen door !important achter de regel te zetten.
Succes!
Hallo,
Hoe ziet de code er dan uit?
Ik heb dit er in gezet:
/* qtranslate language chooser
qtranslate Language Chooser widget .qtrans_language_chooser { list-style-type:none }
.qtrans_language_chooser li { float:left; margin-right:15px } !important
Maar het wordt dan niet aangepast. Hoe kan ik dit doorvoeren?
Hoi Bas,
Zo zou de code moeten zijn:
.qtrans_language_chooser {
list-style-type: none;
}
.qtrans_language_chooser li {
float:left;
margin-right:15px !important;
}
Hoi,
Bedankt voor je reactie, maar bij mij werkt het niet. Zie ik iets over het hoofd? Ik gebruik wp4.0.
Hoi Bas,
Dat kan ik zo niet zien. Ook onder WordPress 4.0 zou dit moeten werken.
Wat je kunt doen is in Google Chrome de vlaggen op je website selecteren en dan met rechtermuisknop kiezen voor Element inspecteren. Je kunt dan zien welke (css) code uitgevoerd wordt. Misschien is er een andere code die dit stukje code overruled of misschien wordt de code niet goed geladen.
Gr.
Lars
http://bloembak24.nl/nieuw/
Zie de footer, ik krijg hem niet aangepast. Heb jij een idee waar ik kan zoeken?
Ik zie dat de naam van de class “ppqtrans_language_chooser” is. Je moet dus twee keer .ppqtrans_language_chooser gebruiken in plaats van .qtrans_language_chooser. Kennelijk is dat veranderd
Thanks, nu werkt het.
Ben ik weer, normaal gesproken kan ik dit allemaal in de style.css zelf aanpassen. Maar ik zou de grootte van de vlaggen willen vergroten van 18*12 pix naar 30*30 pix.
Iemand een idee hoe ik dit kan doen?
Ben ik weer, normaal gesproken kan ik dit allemaal in de style.css zelf aanpassen. Maar ik zou de grootte van de vlaggen willen vergroten van 18*12 pix naar 30*30 pix.
Iemand een idee hoe ik dit kan doen?
Volgens mij kun je dit niet in de style.css aanpassen, maar moet je dan echt de afbeeldingen met de vlaggetjes in de plugin directory vervangen door andere afbeeldingen van het juiste formaat en met de juiste naamgeving.
Dat is het punt, ik heb ze vervangen door een grotere afbeelding. Maar ik zie dat in de template nog steeds 18*12 wordt vrijgehouden waardoor ze dus niet geheel worden weergegeven.
Dan weet ik het zo ook niet en kan ik je helaas niet verder helpen.
Hoi Lars,
Fijn artikel en bedankt. Het lukt mij net als Bas niet, om de vlaggetjes naast elkaar te krijgen. Ik zie de volgende code als ik ‘Inspect Element’ open:
Wat moet de volledige code voor mij zijn? En moet je ook beginnen en afsluiten met /* en */ ?
BVD! Groetjes Dewi
class=”qtrans_language_chooser” id=”qtranslate-2-chooser”
Hoi Dewi,
De code zou voor jou zo moeten zijn als in mijn voorbeeld. De eerste regel met /* ervoor hoef je niet te gebruiken. Dit is alleen een toelichting en hier wordt verder niets mee gedaan.
Het kan zijn dat er bij jou !important achter de regel moet staan. Het wordt dan als volgt:
qtranslate Language Chooser widget .qtrans_language_chooser {
list-style-type:none !important;
}
.qtrans_language_chooser li {
float:left !important;
margin-right:15px !important;
}
Succes!