
Want online customers from all over the world? Then your website will need to speak their language.
After all, while English is one of the most spoken languages globally, this doesn’t mean that everyone can speak it. Even if your visitors can understand the English version of your website, they may be more proficient in another language. And if you’re seeking their business, then you’ll have to adapt to their language preferences – not the other way around.
Accordingly, you’ll need to translate your content into the different languages of your target markets. But to ensure that your website displays the right language content to the right audience, you’ll also have to add code known as “hreflang tags” to your website.
If you’re using WordPress for your website, be aware that it isn’t designed for multilingual website operations out of the box. As a result, you won’t find a built-in setting in WordPress called “Add Hreflang Tags” or similar.
Not to worry, though, because there are various options for adding hreflang tags to a WordPress website. So let’s get into:
We’ll also throw in some best practices for running a multilingual website that delivers an exceptional user experience and drives sales.
Hreflang tags or hreflang tag attributes are HTML code attributes that indicate the language of a web page, and the geographical region for which it was created. Let’s say we have a home page with the URL “https://www.example.com/gb” that contains this hreflang tag:
Here, the hreflang tag indicates that the home page “https://www.example.com/gb/” is:
Web pages can contain multiple hreflang tags at a time – and in fact, they’ll need to, if you have multiple web page variants for targeting visitors with a different language and regional settings.
Search engines use hreflang tags to determine which language and regional variant of a web page to serve to searchers. In fact, Google officially recommends using hreflang tags as part of your localization process. Following the example above, if a searcher from France has French as their language settings, then it wouldn’t be appropriate for the search engine to direct the searcher to the “https://www.example.com/gb/” web page.
Instead, the search engine might try to direct the searcher to an alternative version of the same web page that has the ‘rel=“alternate” hreflang=“fr-fr”’ hreflang attribute (assuming that this page exists).
Separately, have you ever tried visiting a global “.com” version of a web page, only to find yourself automatically redirected to a country-specific variant of that web page? If you haven’t, try going to “https://nike.com/” and observe whether this URL changes as the browser processes your request.
Put simply, the purpose of hreflang tags is to help website visitors access web content specifically adapted for their local context.
By advising on a web page’s target language and regional settings, hreflang tags play a critical role for websites that cater to an international audience. This is because hreflang tags can help:
Search engines want to serve the most relevant results to searchers, in terms of content and language. By using hreflang tags, you help search engines understand which version of your web pages is most relevant for searchers with certain language and regional settings. As a result, search engines may rank that page variant higher in the search engine results pages for those searchers.
For instance, if the search engine detects that your web page contains the hreflang attribute ‘rel=“alternate” hreflang=“en-us”’, then it’d learn that your web page is meant for English language users from the United States. Accordingly, it may rank that page higher in the search results for English language searchers from the United States – which is what you want as you pursue a global SEO (search engine optimization) strategy.
Additionally, search engines do their best to serve unique content to searchers. So when you use hreflang tags, you’re signaling to search engines that certain web pages are not to be considered duplicate content, even though their content may be closely identical. In consequence, search engines learn that they should be ranking all of these highly similar pages, instead of picking only one version of the page to rank.
Following how search engines try to serve unique and relevant content, hreflang tags help direct website visitors to language versions of web pages created specifically for their consumption. This opens up opportunities for you to craft web pages that deliver a truly local user experience – from referencing the local weather to incorporating location-specific images or even including unique slang that isn’t used elsewhere.
When you’ve done so, you may create a sense of connection between website visitors and your brand. You may even foster goodwill that encourages visitors to spend money with you!
“Bounce rate” refers to the percentage of visitors who leave a website after viewing only one page. Ideally, you’d want to try and keep your bounce rate as low as possible.
As per the previous point, hreflang tags help direct website visitors towards content that is relevant for them. If this causes visitors to have a great user experience on the web page they’ve initially landed on, then they might just stick around to browse other pages on your website. This is great news for reducing your bounce rate.
A lower bounce rate can translate to more tangible business results too, such as increased course sign-ups and order volumes.
Now that we’ve seen the importance of hreflang tags, how can we actually implement them on a WordPress site? Here are two solutions:
WordPress plugins are lifesavers, helping to extend your website’s capabilities with little coding needed. And the same applies to implementing hreflang tags – the right WordPress solution with hreflang functionality can automatically add hreflang tags to all your web pages on your behalf.
Weglot is primarily a no-code website translation tool that integrates with your WordPress site to translate website content into practically any language.
Leveraging sophisticated machine language technology such as DeepL and Yandex Translate, Weglot translates content speedily and with a high degree of accuracy. You can then engage professional translators or make manual changes yourself right from the Weglot dashboard to tweak your translations to perfection.
That’s not all: Weglot also effortlessly adds hreflang tags to every web page on your website for you. This is a massive time-saver and frees you up to focus on core business responsibilities.
To get started with Weglot, sign up for a free Weglot account here and start a new translation project. Copy your Weglot account API (you’ll find it in the settings page for your Weglot project) and save it in a safe place – you’ll need it shortly!
Next, search for and install the Weglot plugin into your WordPress website:
Paste your Weglot account API into the settings page. Weglot is now all set up and ready to go.
To translate your website content, select your website’s original language and the languages into which you want your website to be translated. When you save your changes, Weglot will instantly translate your content, and also add hreflang tags to your web pages.
While Weglot is doing its job, you can work on other to-dos for making your website multilingual. Check out our guide to best practices for WordPress multilingual websites if you need a leg-up on this.
Alternatively, if you’d prefer not to use a third-party solution to automate the adding of hreflang tags to your WordPress site, then there’s always the more manual approach. However, you’ll need to be extra careful when manually adding hreflang tags, because:
Accordingly, manual hreflang implementation is recommended only for serious coders who have the time and patience to troubleshoot any hreflang errors that occur. If you fit the bill, then you could manually add hreflang tags through one of the following ways:
Head over to the <head> section – pun not intended – of one of your web pages, then add all the hreflang tags you need there. Rinse and repeat for every web page (or page variant, to be precise) on your website. Be sure to provide the correct language and region codes, and alternate page URLs, in your hreflang tags.
While this method sounds straightforward in theory, it’s going to get quite tedious manually adding multiple hreflang tags to all your web pages. Not only that: if your web pages end up containing dozens of hreflang tags, your page load speeds might suffer. Your SEO could take a beating as a result, because search engines prefer to rank web pages that load quicker, with all else being equal.
An XML sitemap is a file containing information on the contents of your website (pages, images, videos, and so on). Search engines refer to the XML sitemap to learn which content on your website is more important, such that they should pay special attention to crawling – and hence indexing and ranking – it.
To add hreflang tags to your XML sitemap, you’d use code that looks like this:
Adding hreflang tags to your XML sitemap simplifies the manual hreflang implementation process. This is because you’ll essentially place all your hreflang tags in one central location, with no need to replicate them across multiple pages. As a result, you eliminate unnecessary on-page code, and can also shorten your page loading times. Though of course, the more page variants you have, the more complex your XML hreflang implementation will become.
Regardless of which method you use to manually add your hreflang tags, be on the alert for implementation errors afterward. If your hreflang tags haven’t been added correctly, you may encounter the “Your site has no hreflang tags” error message in Google Search Console.
While this is a common problem with DIY implementation, the exact cause of the error can take some time to identify and fix. If you’ve run into this issue, we have a separate guide to troubleshooting the “Your site has no hreflang tags” error that you may find useful.
Adding hreflang tags to your WordPress website isn’t the end of the story. To produce a well-built multilingual site built for international SEO, follow these hreflang best practices:
As previously discussed, there are many moving parts and risks associated with manually adding hreflang tags. Even if you’re an experienced coder, you cannot absolutely rule out human error. It’s also difficult to know if you’ve implemented them incorrectly – you’ll have to manually check each of them and whether they’re showing the right country code.
That’s why we recommend using our free hreflang tag checker! Simply copy-paste your URL, choose a search engine that you want to be optimized for and click on the “Test URL” button.
The tool will check whether your hreflang tags were implemented correctly and show you details like alternate languages URLs, whether they’re indexable or not, current status and if there are any errors. In the example below, you can see that the hreflang tags were implemented incorrectly!
WordPress doesn’t offer a feature for designating translated variants of a certain web page, so you’ll need a separate tool for this. In this regard, there are various WordPress-compatible solutions, such as Weglot.
Boost the performance and functionality of your multilanguage WordPress websites using reputable and powerful WordPress plugins. Such plugins include:
What’s more, many of these plugins can be used for free! This is a big opportunity to soup up your website at no cost, so don’t hesitate to add such plugins to your multilingual site if it makes sense to do so. Make sure to check if they’re compatible with your WordPress theme before you use them on your website!
If you’re making your WordPress website multilingual, then you absolutely cannot afford to skip over hreflang tags. Adding these tags to your website – and adding them correctly – is key to ensuring that:
With its ability to automate the implementation of hreflang tags and render high-quality machine translations of content, Weglot is the ideal translation solution for webmasters who want to take their WordPress website to the world stage. It supports over 100 languages including Spanish, German, Arabic, Sinhala, Afrikaans etc.