Weglot is a translation API that offers integrations for several platforms. We're going to focus on the Weglot Translate WordPress plugin in this tutorial. Check out our Weglot review if you'd like to learn more about the API in general. Let's get started with this Weglot tutorial.
- Installation & configuration
- Customizing the language button
- Configuring the language button position
- Excluding specific pages and elements
- Redirecting visitors automatically
- What to do after you install Weglot
- Using the Weglot dashboard
Installation & configuration #
Setting up the Weglot plugin is easy. It starts with a simple installation process, which you can do in the WordPress admin area by downloading the plugin from the WordPress repository.
You can also download it here and upload the ZIP folder to the backend of WordPress or the plugin folder to your file system via FTP. You'll need an API key to configure the plugin, so your next step should be to create an account (you only need an email and password).
Let's go over configuring the Weglot plugin.
Configuration #
You'll be greeted with your API key after you create an account and confirm your email address.
Copy and paste this key into the API key box on the Weglot configuration page. Make sure you save your changes before leaving this page.
Next, use the Original Language setting to choose the primary language your site uses. Use the Destination Languages box to enter the language(s) you want to translate your site into. Select a language by selecting it from the drop-down menu or by entering its name.
Click Save Changes, and head to the homepage of your website. You should now have a language button in the bottom, right-hand corner.
Let's talk about customizing the appearance of this button.
Customizing the language button #
If you look at the Language Button Appearance section, you'll notice a handy little preview feature at the top. Refer to this as you adjust the settings to ensure the button appears the way you want it to. Let's start with how the menu in the button appears. The default setting you see in the screenshots is the drop-down setting. You can use an inline style instead by unchecking the box.
The setting after that allows you to do decide whether or not you want to have flags represent each language in the menu. All you need to do is uncheck the box if you don't. If you do decide to keep the flags, you can change their appearances with the next setting. This one allows you to choose one of four styles.
The next two settings control the way the text of the language appears. You can choose to omit text altogether by unchecking the "With name?" box. You can also display the full word of a language, as opposed to an abbreviation, by checking the "Full name?" box.
The last setting can be used by those experienced in CSS. It's a text editor you can use to add custom styles to the language button. The filler text in the box provides a couple hints as to how to edit the appearance using the class "country-selector". You can use this CSS class to change the background color and font style in under a minute:
Let's go over how to control where the button is placed.
Configuring the language button position #
The default location for the language button is in the bottom, right-hand corner of the screen. It's a sticky menu, so it'll stay with your visitors as they scroll. You can change the location of this button using a few different methods. The first allows you to add it to your navigation menu by checking the box for the "In menu?" setting.
You'll likely need to add a bit more code to the Override CSS box to get the button to appear properly in your own menu. If you have several navigation menus on your site, you'll need to add a CSS rule to hide the ones you don't want to display. You can ask the support team for help with this. You can also add the button to any widget area with the Weglot Translate widget.
Lastly, you can use the shortcode:
[weglot_switcher]
or ID selector:
<div id="weglot_here"></div>
to place the code wherever you wish.
Let's move on to the next section.
Excluding specific pages and elements #
There may be a few pages and posts you don't want translated as well as a few elements. For example, the title of our test website (MH Themes) was translated, which isn't ideal as it's our brand name. You can solve these minor issues by adding the URLs of specific pages and posts in the Exclude URL here box. You can also prevent certain elements from being translated by adding their CSS selectors to the Exclude Blocks box.
Redirecting visitors automatically #
Auto redirects are a feature you'll have access to when you subscribe to any premium plan. All you need to do is scroll to the bottom of the plugin's settings page in WordPress, and check the box labelled "Auto redirect?". It'll redirect visitors to translated pages automatically depending on their browser language preferences.
What to do after you install Weglot #
Weglot does a pretty good job at translating content automatically, but it's important to remember that automatic translations will never be as accurate as manual translations conducted by someone experienced in the language. This is true no matter who's writing the code. This is why we recommend taking this process as slow as possible.
After you install Weglot, you can do a few different things to ensure the translations are as accurate as possible before you go through the trouble of hiring professionals. It may be a good idea to create a copy of your website on another server using a dummy domain.
If you can round up a group of international / bilingual visitors, you can receive feedback (and maybe even user-supported translations) on translated content without affecting your actual site, so long as you tell search engines not to index the dummy site. This method allows you to optimize translations before you add them to your site by exposing them to a small group of beta users first.
You can just as easily translate your actual site and get feedback on the go, however. Keep reading if you're interested in working with a professional translator.
Using the Weglot dashboard #
This is the Weglot dashboard. The home screen gives you a snapshot of the plan you're using, the number of words the plugin has translated on your site, the number of human translations made, the number of languages your site is translated into and statistics for translated content.
Translations List #
Head to the Translations List section first and foremost to view a complete list of all of the translated content on your site. It makes it easy to perform actions on these items in bulk. You can either check the boxes for multiple items to edit them in bulk or perform the actions on an individual basis. Either way, go through the list, and perform one of these actions with each item:
Edit - Edit a translation manually.
Mark as Reviewed - Archives the item.
Delete - Deletes the item.
If you're having trouble figuring out which text belongs to which URL, use the URL filter on the left-hand side.
Add to professional order - Adds the item to your cart, which you'll use to purchase professional translations.
Translations are available from Weglot's professional translators at a starting rate of €0.08 / word. You'll need to be subscribed to their Starter plan or higher to gain access to this service. In any case, once you add items to a professional order, you can view your cart where a total cost will be tallied for you.
Let's go over the Visual Editor.
Visual Editor #
The Visual Editor makes it easy for anyone to edit translations manually with Weglot. It autosaves edits, so your changes are added in real time. All you need to do is launch the visual editor, navigate to the URL you want to edit (or enter it in the URL box in the bottom, left-hand corner) and select individual items to edit.
Translation Tools #
The last feature we're going to go over are the translation tools. They're fairly straightforward. Use the Translation Exceptions tool to exclude or force the inclusion of specific words in translations.
If you've already translated your site and accidentally included words that shouldn't have been translated or were translated incorrectly, use the Search and Replace tool.
Expanding your translation team #
When you subscribe to the Weglot Pro plan or higher, you'll have the ability to add an unlimited number of members to your team. All you need to do is enter their email address, assign the Manager or Translator role to them, and click Add Member.
That's it for this Weglot tutorial. Be sure to read our review if you'd like to learn more about the features and plans Weglot offers. How do you like Weglot? Have you used this WordPress plugin for multilingual websites already? Please share your feedback in the comments below.