WordPress

How to add custom titles and meta descriptions to each page in WordPress without a plugin

Table of Contents

  1. Enable WordPress’ built-in Custom Fields
  2. Add the custom title and meta description to your page or post
  3. Add custom code to the functions.php file
  4. Compatibility with your theme
  5. Testing things out
  6. Advantages of using this method
  7. Conclusion

For WordPress users, having control over SEO elements like custom titles and meta descriptions is essential for search engine optimisation and improving click-through rates. While plugins like Yoast offer these features, sometimes a lightweight approach without extra plugins is preferred. In this guide, we’ll show you how to set custom titles and meta descriptions using WordPress’s built-in Custom Fields, with just a few lines of code.

Step 1: Enable “Custom Fields” in WordPress

To use Custom Fields, you’ll first need to enable them:

  1. Edit a Page or Post: Go to Pages or Posts in your WordPress dashboard, and select the page or post you want to add a custom title or description to.
  2. Enable Custom Fields:
    • In the Block Editor (Gutenberg), click the three vertical dots (Options) in the top-right corner, then go to Preferences > Panels and toggle on “Custom Fields.”
    • In the Classic Editor, simply check the Custom Fields option under Screen Options at the top of the page.
click on the three dots to bring up the side panel

Choose the preferences option
Choose the ‘Preferences’ option so that we can enable ‘Custom Fields’
Important: Toggle on ‘Custom Fields’ and then click the “Show and Reload Page” button

Once enabled, the Custom Fields section will appear below your content editor, as in the image below:

The Custom Fields will now appear once you’ve clicked on the “Show and Reload Page” is saved and reloaded

Step 2: Add custom fields for your title and meta description

Now that Custom Fields are visible, you can add fields for your title and description.

  1. Scroll down to the Custom Fields section at the bottom of the page editor.
  2. Click Add New to create a new custom field.
  3. In the Name field, enter meta_title for the title.
  4. In the Value field, type in your desired custom title.
  5. Click Add Custom Field to save.
  6. Repeat these steps with meta_description in the Name field to add a custom meta description.

Repeat these steps for each page or post where you want to set a unique title and description.

Step 3: Add custom code to your theme’s ‘functions.php’ file

Note: We recommend that you use a child theme to add the additional code so that changes that you make are not overwritten when you update your WordPress theme.

To make WordPress recognise and use your custom title and meta description fields, add the following code to your theme’s functions.php file.

  1. In your WordPress dashboard, go to Appearance > Theme File Editor.
  2. Select your child theme’s functions.php file.
  3. Copy and paste the code below into functions.php:

// Function to set custom <title> tag using 'meta_title' custom field
function custom_meta_title() {
    if (is_singular()) {
        global $post;
        $custom_title = get_post_meta($post->ID, 'meta_title', true);
        if ($custom_title) {
            return esc_html($custom_title);
        }
    }
    return get_the_title() . ' | ' . get_bloginfo('name'); // Fallback title
}
add_filter('pre_get_document_title', 'custom_meta_title');

// Function to set custom <meta description> using 'meta_description' custom field
function custom_meta_description() {
    if (is_singular()) {
        global $post;
        
        // Fetch only the first value for 'meta_description' to prevent duplication
        $custom_descriptions = get_post_meta($post->ID, 'meta_description', false);
        $custom_description = $custom_descriptions ? $custom_descriptions[0] : '';

        if ($custom_description) {
            echo '<meta name="description" content="' . esc_attr($custom_description) . '">';
        }
    }
}
add_action('wp_head', 'custom_meta_description');

This code checks for a custom field called meta_title to set the title, and meta_description to set the meta description. If either field is missing, it defaults to the page title or skips the meta description.

Compatibility with most WordPress themes

This code should work with the majority of WordPress themes, but here are a few things to check to ensure compatibility:

  1. Support for title-tag: Most modern themes, including GeneratePress, Astra, and the default WordPress themes, use add_theme_support('title-tag'); in their functions.php file. This allows WordPress to manage the <title> tag dynamically, so our custom code won’t cause duplication. If your theme doesn’t support this, consider adding it, or check if there’s a hardcoded <title> tag in your theme’s header.php.
  2. wp_head Hook in <head> Section: Almost all themes include the wp_head function in the <head> section of their header.php file. This hook outputs essential metadata, including the custom meta description from our code. If your theme lacks this hook, the <meta name="description"> won’t appear in the page source, so you may need to add <?php wp_head(); ?> manually in header.php.
  3. No Hardcoded <title> or <meta> Tags: Ensure that your theme doesn’t hardcode a <title> or <meta name="description"> tag directly in header.php. Hardcoded tags can cause duplication issues when combined with this code.

Step 4: Test your custom titles and meta descriptions

After adding the code, test a few pages to ensure the custom titles and descriptions are displaying correctly:

  1. Open one of the pages where you set a custom title and description.
  2. Right-click on the page and select View Page Source.
  3. Look for the <title> tag and <meta name="description"> tag in the <head> section to confirm your custom values are in place.

Advantages of this approach

  • Lightweight: This method avoids the need for an additional SEO plugin, keeping your site lean.
  • Full Control: You can specify unique titles and meta descriptions for each page individually.
  • Customisable: You can easily expand this approach by adding additional SEO fields like meta_keywords or Open Graph tags.

Conclusion

Adding custom titles and meta descriptions without a plugin is an effective way to control your page SEO while keeping your WordPress installation lightweight. By using WordPress’s built-in Custom Fields and a few lines of PHP code, you can achieve plugin-free SEO optimisation and boost your website’s visibility.