Hreflang Tags SEO – An Exclusive Guide For Beginners [2020]

Welcome to hreflang tags SEO hub for 2020. Hreflang tags are some of the most important HTML tags for a multilingual or internationally targetted website. Whether you are an absolute beginner or an SEO expert looking to learn extra advanced techniques, this page will guide you. After working for 6+ years in the SEO industry, I bring you a hreflang tutorial that will make all concepts clear.

how to add hreflang tags - an international seo guide
What You'll Learn:
Discover the meaning of hreflang tags, multiple ways to add in wordpress, blogger & shopify, tools for generating & testing, fixing errors, & more.

How to add hreflang tags

The hreflang tags or language HTML attribute tells search engines about the language used in web page content and the geolocation that you are targeting. It specifies the accent for a page on a multilingual website. It is extremely useful for Local SEO. They are placed in the header section and recommended by Google Search Console. It helps us to rank in a particular country, location, or local area.

Suppose, a website publishes on multiple tongues such as French, Spanish, Hindi, Nepali, and so on. These attributes will boost SERP discovery for people searching from that targeted location. Such tags help to reach a geo-targeted audience within a territory or region.

Structure of HREFLANG Tag

A language tag is implemented in the HTML format. Below is a sample for a blog written in the English language:

 <link rel="alternate" hreflang="language" href="http://example.com"> 

Format to target a specific region or country (for the United States):

 <link rel="alternate" hreflang="en-us" href="http://www.example.com" > 

For the United Kingdom:

 <link rel="alternate" hreflang="en-uk" href="http://www.example.com" > 

Hreflang tags for india:

 <link rel="alternate" hreflang="in" href="http://www.example.com" > 

For Nepal:

 <link rel="alternate" hreflang="np" href="http://www.example.com" /> 

Similarly, you can create more HTML hreflang tags by replacing ‘language’ in the above examples with your own as shown in the first sample.

Warning: This method is only for those who are experts in coding skills and have proper understandings of HTML.

Hreflang Tag WordPress – free plugin method

The following tutorial explains how to add hreflang tags in WordPress without using any paid plugins for international SEO in 2020.

  • First of all, install the free Header and Footer scripts WordPress plugin.
  • Then, edit the individual post where you want to set the hreflang tags via the dashboard.
  • Scroll down and find the “Insert Scripts to Header” box.
  • There, you can paste the appropriate hreflang tag taking help from the examples described above.

Note: Never edit the core header.php file directly for this purpose. The changes will disappear upon the theme update. If it gets worse, any misplaced code can break your site.

Hreflang Tag Generator

To make things safe & easier, we can use a paid plugin known as HREFLANG MANAGER. This is a safe, faster, and easier method than the previous one. We can directly add hreflang tags in WordPress using that plugin.

Once the plugin is activated, a new tab named ‘Hreflang’ is found in the WordPress Dashboard. To change default hreflang tags for the entire site, navigate to  Hreflang > Options > Defaults . There you can select up to 10 different languages and locales.

For individual posts, just enter the WordPress editor and scroll down to ‘Hreflang Manager’. There you can insert the up to 10 URLs of the page built in other languages with locale and language.

 

Your site has no hreflang tags

According to a Google Webmasters Forums Platinum Product Expert, it is normal to see the error “your site has no hreflang tags“. If you have recently updated the site and added hreflang tags properly, it takes some time to update the report (approx. 24-48 hours).

hreflang tags checker

There are many hreflang tags checker tools on the internet. Among them, the International Targeting Report by Google Search Console is the official tool. It shows the language and country associated with a page in two separate tabs.

Similarly, you can also use the free hreflang checker tool to validate the codes are working properly or not. Just head over the tool and insert your URL. If the codes are not working, it will show a warning as shown below in the screenshot.

hreflang tags checker audit result

Solving hreflang tags with errors

1. Hreflang Return Tags: The purpose of the hreflang tag is to tell search engines about two versions of the same page but in a different language. To solve the no-return tags errors, both the pages should interlink with one another using proper Hreflang HTML attributes.

2. Wrong Language Code: The regions and languages must comply with the ISO 693-1 & ISO 3166-1 alpha-2 standards. You should specify both the accent and the country. For example, “en-gb” is used to target English speaking audience in the United Kingdom. The ISO files will reveal the proper codes for each targeting.

Similarly, never consider that adding hreflang tags will fix the duplicate content issue. There are canonical tags for it. Also, it’s an unverified misconception that such HTML tags increase DA & Link Authority. They are meant just for geo-targeting. In addition, if you add hreflang annotations to a noindex page, Google returns an error.

hreflang tags blogger

You can edit the source code of each page in a blogger to insert the attributes. There are two ways to edit a post, visual and HTML editor. These attributes can be applied through the HTML editor in Blogspot. Plus, if you want to implement a single code to the whole site, edit the theme’s source file via template editor. The location to insert the hreflang tag on a blogger template is just below the <head> tag.

hreflang tags Shopify

For Shopify users, you need to edit the theme.liquid file and add the following code:

<link rel="alternate" hreflang="x" href="{{ canonical_url | replace: shop.domain, 'DOMAIN OF X STORE HERE' }}" />

FAQs

What are hreflang tags?

Hreflang tags are the HTML annotations that indicate two pages of the same meaning but built in different languages. They are extremely useful for international targetting in multiple geographical regions.

Where to put hreflang tags?

Whether it is Blogger, Wordpress, Shopify, or any other Content Management System, you must have access to the theme's header file or template. There you can insert the hreflang annotations between the <head> and </head> section of the page.

Final Verdict

This guide about how to add hreflang tags must have helped you to gain more reach and SEO. On the contrary, it’s not super easy but with some practice, you can easily implement those annotations on your blogs. So, if you are looking for some additional help, the comment section is all yours. Blast it up. 🙂

2 thoughts on “Hreflang Tags SEO – An Exclusive Guide For Beginners [2020]”

Leave a Comment