In this guide you will learn how to add hreflang tags in WordPress without a plugin, along with explanations about why and when you need them.
Implementing hreflang tags is crucial for international SEO, as these tags help search engines understand the language and targeted region of your content, ensuring the correct version of your page appears in the right country’s search results.
Why and When Do You Need Hreflang Tags?
Hreflang tags are necessary when you have multiple versions of the same content in different languages or target different regional audiences. For example, if you have an English version of your site for the United States and another for New Zealand, hreflang tags tell Google and other search engines which version to display based on a user’s language or location.
Key Benefits:
- Improved International SEO: Search engines display the most relevant language/region-specific version of your content.
- Reduced Duplicate Content Issues: HrefLang tags help search engines understand that similar content in different languages is not duplicate content.
- Better User Experience: Visitors automatically see content in their preferred language or region.
You typically need hrefLang tags when you start localizing your site’s content, expanding internationally, or serving multilingual audiences.
Add Hreflang Tags in WordPress Without a Plugin
Prerequisites: A child theme is recommended so that your changes don’t get overwritten by future theme updates. If you haven’t created a child theme yet, follow this tutorial and learn How To Create a Child Theme.
Add a Custom Meta Box for Hreflang Tags in the Post/Page Editor
Instead of using a plugin, we’ll add a meta box directly to your theme’s functions.php
to insert hreflang tags. In your child theme’s functions.php
, paste the following code:
<?php
/**
* Plugin Name: hrefLang Option for Single Posts/Pages
* Description: Adds a custom field in posts/pages to insert a <link> tag into the <head> for that specific post/page.
* Version: 1.0
* Author: Spiro Kovac
* License: GPL2
*/
// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
/**
* Add a hrefLang meta box to the post and page edit screens
*/
function chl_add_hreflang_meta_box() {
add_meta_box(
'chl_head_link_meta',
'hrefLang Head Link',
'chl_render_meta_box_content',
array( 'post', 'page' ), // display on posts and pages
'normal',
'high'
);
}
add_action( 'add_meta_boxes', 'chl_add_hreflang_meta_box' );
/**
* Render the meta box content
*/
function chl_render_meta_box_content( $post ) {
// Add a nonce field for security
wp_nonce_field( 'chl_save_meta_box', 'chl_meta_box_nonce' );
// Retrieve the existing value from post meta
$value = get_post_meta( $post->ID, '_chl_head_link', true );
echo '<p>Enter a <code><link></code> tag to be placed in the <code><head></code> section of this page/post. Example:<br><code><link rel="alternate" href="https://spirokovac.com/" hrefLang="en"/></code><br><code><link rel="alternate" href="https://spirokovac.com/nz/" hrefLang="en-nz"/></code><br><code><link rel="alternate" href="https://spirokovac.com/" hrefLang="x-default"/></code></p>';
echo '<textarea style="width:100%;height:60px;" id="chl_head_link_field" name="chl_head_link_field">' . esc_textarea( $value ) . '</textarea>';
}
/**
* Save the meta box data when the post is saved
*/
function chl_save_meta_box_data( $post_id ) {
// Check if our nonce is set and valid
if ( ! isset( $_POST['chl_meta_box_nonce'] ) || ! wp_verify_nonce( $_POST['chl_meta_box_nonce'], 'chl_save_meta_box' ) ) {
return;
}
// Check if the user has permission to edit the post/page
if ( ! current_user_can( 'edit_post', $post_id ) ) {
return;
}
// Check if this is an autosave, if so, do nothing
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
return;
}
// Check if our field is set
if ( ! isset( $_POST['chl_head_link_field'] ) ) {
return;
}
// Sanitize and validate the field
$input_value = trim( $_POST['chl_head_link_field'] );
// Optional: only save if it contains a <link> tag
if ( strpos( $input_value, '<link' ) !== false ) {
update_post_meta( $post_id, '_chl_head_link', $input_value );
} else {
delete_post_meta( $post_id, '_chl_head_link' );
}
}
add_action( 'save_post', 'chl_save_meta_box_data' );
Print the Custom Metabox HrefLang Tags in the Head of the Single Post or Page.
Create a new folder inside your child theme called addon
.
Example path: wp-content/themes/your-theme-child/addon/
Create a new PHP file in this addon
folder, for instance hreflang.php
, and insert the following code:
<?php
/**
* Output the custom <link> tag in the head if on a single post/page
*/
if ( is_singular( array( 'post', 'page' ) ) ) {
global $post;
$head_link = get_post_meta( $post->ID, '_chl_head_link', true );
// Check if we have a <link> tag stored
if ( ! empty( $head_link ) && strpos( $head_link, '<link' ) !== false ) {
echo "\n" . $head_link . "\n";
}
}
?>
Edit your child theme’s header.php
file.
Copy your parent theme’s header.php
to your child theme, then open it and add the following line before the closing </head>
tag:
<?php include 'addon/hreflang.php'; ?>
What Are Best Practices Using HrefLang?
Best Practices:
- Use Consistent Language Codes:
Stick to standard two-letter language codes (e.g.,en
,fr
) and region codes (e.g.,en-GB
,en-US
). Make sure these codes match the language/region of your translated content. - Implement Bidirectional Links:
Every hreflang tag should point to its alternate versions, and those alternate pages should also point back. This ensures that search engines understand the full relationship between pages. - Include x-default for Global Pages:
For language selectors or global pages, usehrefLang="x-default"
to indicate a fallback page for users whose language/region settings don’t match your defined alternates. - Use Absolute URLs:
Always include the full URL (includinghttps://
) in hreflang tags to avoid confusion and ensure proper indexing. - Keep Hreflang Markup Consistent:
Ensure that all language variants use the same structure and link to each other consistently. Regularly check for broken links or mismatches.
Adding Your Hreflang Tags to Individual Posts/Pages
- Go to the post or page you want to add hreflang tags to.
- You’ll now see a new meta box labeled “hrefLang Head Link.”
- Insert your
<link>
tags (for example:<link rel="alternate" href="https://spirokovac.com/" hrefLang="en" />
<link rel="alternate" href="https://spirokovac.com/nz/" hrefLang="en-nz" />
<link rel="alternate" href="https://spirokovac.com/nz/" hrefLang="x-default" />
) - Update the post/page.
Your hrefLang tags are now added to that specific page’s <head>
section for free and without using any plugin.
How to Validate Hreflang in WordPress
- Third-Party Hreflang Testing Tools:
- Use tools like Hreflang Checker or other third-party SEO tools.
- Enter your page URL to confirm correct hreflang annotations and ensure all alternate URLs are reachable and correct.
- Manual Inspection of Source Code:
- Open the page in a browser and view the source code.
- Check
<head>
section for<link rel="alternate" href="..." hreflang="...">
tags. - Verify that each link points to the intended language/region version.
- Browser Extensions and SEO Auditing Tools:
- Tools like the “Web Developer” browser extension or “Ahrefs” and “SEMrush” site audits can sometimes highlight hreflang issues.
By regularly validating your hreflang tags, you ensure that search engines correctly interpret your site’s language targeting, improving global rankings and user experience.
Need Help With Your International SEO?
If you’d rather have an SEO expert ensure that your hreflang tags are implemented correctly and optimize your site for international search, consider getting professional assistance. Hire me as your SEO expert to boost your site’s ranking and visibility globally.