In this post
In this post
One of the hardest aspects of creating a multilingual website is making sure search engines index your content properly. For that to happen, crawlers need to understand that there are multiple versions of each page, each in a different language. That’s where hreflang WordPress tags come in.
Hreflang tags aren’t inherent to WordPress websites, however, they’re easy to implement using this Content Management System (CMS). You can do so with or without a plugin, depending on the approach you want to take.
In this article, we’ll talk about what hreflang tags are in WordPress. We’ll also teach you how to add them to your pages manually as well as by using a translation plugin. Let’s get to work!
What Are hreflang Tags?
Hreflang tags are simple code snippets placed within your HTML headers. They tell search engines what language you’re using on that specific page. Here’s an example:
<link rel="alternate" href="https://yourwebsite.com.com" hreflang="en-us">
This tag tells Google—and other search engines—that the page is in U.S. English. Hreflangtags can be incredibly specific in that regard, which is perfect for multi language websites.
The alternate designation is what tells search engines they’re not looking at a completely new page, but a version of content they’ve already indexed in another language. Ideally, you’ll use hreflang tags in all three of the following scenarios:
- Your website content is in multiple languages;
- You have web pages that use variations of the same language, such as American and British English;
- Your website uses a combination of multiple languages and regional variations.
Without hreflang tags, users who find your content through search engines might not see results in their own languages. Likewise, if they click on your links, they’ll see your content in its ‘default’ or original language.
Some of those users might be savvy enough to find your language switcher so they can read your content. However, a lot of them won’t be. This means that not adding this simple tag can cost your users. Fortunately, implementing hreflang tags in WordPress is remarkably simple.
But before we get into the in-depth tutorial, here’s a short video you can watch if you’re short on time:
How to Add hreflang Tags in WordPress Without a Plugin (2 Ways)
There are two ways to add hreflang tags in WordPress without a plugin. Let’s start with the most straightforward approach.
1. Add hreflang Tags to Your HTML Headers
Every WordPress theme has a header.php file, which you can edit. If you want to add hreflang tags in WordPress without a plugin, the quickest way is to go to your dashboard and navigate to Appearance→ Theme Editor. Here, look for the header.php file in the sidebar to the right:
Notice that we’ve highlighted the contents of the head tags in the screenshot above. This is where you’ll want to add your hreflang tag(s).
For example, if you translate your website from English into Italian and French, you would add the following after <head> and before </head>:
<link rel="canonical" href="http://yourwebsite.com"> <link rel="alternate" href="http://yourwebsite.com" hreflang="x-default"> <link rel="alternate" href="http://yourwebsite.com" hreflang="fr-fr"> <link rel="alternate" href="http://yourwebsite.com" hreflang="it-it">
In this code snippet, we’re using two new elements you haven’t seen yet. The first line sets the ‘canonical’ version of your content, which would be each page in its original language.
The second line includes the x-default tag, which tells search engines which version of your website to display if they can’t find one that matches a user’s preferred language. Including this tag is considered a best practice when it comes to hreflang tags, which we’ll discuss further later in this post.
Although this approach is quick, it also comes with downsides. Unless you’re using a child theme, any hreflang tags you add to your header.php file will disappear when you update your theme. For that reason, we don’t typically recommend this approach for WordPress sites.
2. Include hreflang Tags In Your XML Sitemap
An XML sitemap is a document you can submit to search engines that includes all the pages and files within your website. As the name implies, it’s a map that ensures all key elements of your website (within reason) are crawled and indexed.
Sitemaps are particularly useful for multilingual websites, as they enable you to indicate all the existing versions of each page. Here’s a quick example of what hreflang tags look like within a sitemap:
<url> <loc>http://yourwebsite.com</loc> <xhtml:link rel="alternate" "hreflang="es-es" href="http://yourwebsite.com/es/"/>
</url> <url> <loc>http://yourwebsite.com/es/</loc> <xhtml:link rel="alternate" hreflang="en-us" href="http://yourwebsite.com/"/>
The structure of hreflang tags changes when you switch from HTML to XML files. However, the underlying logic remains the same—hreflang tags are bidirectional, which means you need to add as many variations as there are languages on your website.
Arguably, this approach can speed up loading times on your website since you’re not adding code directly within your HTML headers. However, in practice, the impact is almost always negligible.
In any case, it’s safer to edit your sitemap than it is to modify your theme files. However, the more languages your website uses, the more complex this implementation becomes.
How to Add hreflang Tags With a WordPress Translation Plugin
So far, we’ve explored two manual approaches for adding hreflang tags in WordPress. Both work, but in practice, they can be a hassle to implement. That particularly applies to complex websites, with a lot of pages. For example, imagine trying to add hreflang tags using a sitemap for an online store with hundreds of products for sale—it would be a nightmare.
For most WordPress users, there are very few scenarios where it makes sense to add hreflang tags manually. Instead, you can use a translation plugin such as TranslatePress that will automatically incorporate them for you.
The TranslatePress plugin will add the hreflang attribute automatically for each language that your site uses.
All you need to do when using TranslatePress is to select and add languages to your website by navigating to Settings → TranslatePress → General tab in your WordPress dashboard:
This functionality is also available with the free version of the plugin on wp.org.
TranslatePress can also differentiate between regional variations of most languages. For example, there are six different ‘types’ of English you can use, as shown in the image above.
Search Engine Optimization (SEO) Best Practices for hreflang Tags
Regardless of which approach you take when it comes to implementing hreflang tags, there are some basic guidelines you should follow. As we mentioned before, using the x-default tag is one of them. This tells search engines which version of your website they should display if they can’t find a specific variant that matches a user’s preferred language. TranslatePress automatically adds the option to set this tag to your site as well, Settings → TranslatePress → Advanced tab → Miscellaneous section → Enable the hreflang x-default tag for language option.
Additionally, for hreflang tags to work, they need to be reciprocal. If you’re browsing the English version of a website, it should include tags that point to its alternate languages and vice versa. Search engines won’t recognize hreflang tags if there isn’t a reciprocal link. This prevents competitors from creating tags to pass their pages off as alternate versions of your content.
TranslatePress automatically implements bidirectional hreflang tags, so you don’t have to worry about getting it right. It can be challenging to ensure you’re not missing any if you’re approaching this task manually.
Finally, the proper implementation of hreflang tags requires you to use specific country and language codes. In many cases, those codes are self-evident. However, if you’re going to add hreflang tags manually, we recommend double-checking them by referencing the ISO 639-1 standardized nomenclature.
Once more, if you’re using a translation plugin you don’t need to worry about adding the correct language and country codes. TranslatePress will take care of that for you so that you can focus your efforts elsewhere.
Get TranslatePress and Stop Worrying About hreflang Tags Today
Hreflang tags are key elements in multilingual websites. If you rely on search engines for the brunt of your traffic, you need to make sure you implement them in WordPress correctly. You can either add them manually or by using a translation plugin such as TranslatePress to automate the process.
TranslatePress Multilingual
If your website uses hreflang tags, it’s also important to follow best practices for multilingual SEO. These include adding an x-default tag, making sure your hreflang tags are bidirectional, and listing the correct language and country codes.
Do you have any questions about how to use hreflang WordPress tags? Let’s go over them in the comments section below!
If you found this post helpful, please check out our YouTube channel, where we constantly upload short & easy-to-follow video tutorials. You can also follow us on Facebook and Twitter to be the first to know each time we post.
So just to double confirm, there is no need to add hreflang by html header or sitemap if u translate the page using Translatepress?
Because I don’t see any hreflang in the header.php by default after page translated
2nd question, will the translated page indexed by Google even in the free version without SEO pack?
Hello,
You don’t need to do anything. The sitemap will work once you have the SEO pack add-on installed. If Google finds the translated page, it will index it, but some of the data will be in the original language. The SEO Pack add-on also solves this issue.
Is there any known conflict with other plugins, like RankMath or something? Asking this becasue, when I use your plugin, I get error from all audit services like aHref, Semrush etc.
For example:
Page referenced for more than one language in hreflang
Mismatched hreflang and HTML lang declarations
Hi Volkan,
TranslaPress is fully compatible with RankMath, as well as all the major SEO plugins. We need to check exactly what these errors are, if these are not false positives, and if there’s something appearing in google search console related to this. Could you reach out to our support team to investigate further?