Inserting meta tags into a WordPress theme.

Time to sort the metatags!

Basic meta tags can be easily inserted into a website by using one of the many SEO plugins freely available (e.g. Yoast) the advantage of a plugin is that you don’t need to go anywhere near code.

There are other plugin solutions such a Meta Tag Manager which comes with an installation video including how to use the plugin. If you have a reason not to use a plugin below is a detailed guide to install the tags directly into the theme code.

To get an idea of what code looks like without risking interfering with the theme you can view the source code through a tab in your browser.

Google

Safari

Sometimes if the ‘Develop tab’ in Safari does appear you may need to activate the ‘developers tools’ in the ‘Preferences tab’.

You can’t edit in the browser but it lets you see the code that makes up the page. Visit the website, in this case it will be the front page and look for the ‘head’ as code it will look like this <head> the end of the head code will look like this </head> This is typical of html format.

This is the start and the end of the head code on the BBC site.

Remember that if a meta tags analyser has found NO Meta Title or meta description then you will be adding them. It one already exists then you will have to edit the existing one carefully. We’ll discus that later.

Writing the Meta Title, Meta description.

This is covered in the Meta Tags post but to recap including the title in 2024 you have just 230 characters Title (70 characters) + Description (120-160 characters) to describe your site including spaces.

What is a meta tag generator?

Lets be clear a meta tag generator DOES NOT write the meta tags for you, you have to use your craft to do that. It takes the meta tags you have written and adds the html code ready for insertion into the WordPress theme editor (the working code of the website.)

You can Google “free meta tag generator” which will offer a variety one of which is here.

Add your written meta tile, meta description (and possibly meta keywords) to the boxes and complete any other requests. (see advice below), generate the meta tags and copy to your clipboard. Some free tools only allow a few tries free so try to be accurate.

What are the meta tags I might encounter?

Typically you might encounter these:

Allow robots to index your website?

Usually yes, but by using no you can prevent your site being visited by google. This can be useful if you are still building the site and want to avoid premature indexing or if you want the site for more private use rather than literally the whole world reading you content.

Allow robots to follow all links?

Yes if you want your site to grow organically and you want to build links to other sites

What type of content will your site display?

UTF-8 is the dominant encoding for the World Wide Web (and internet technologies), accounting for 98.2% of all web pages, 99.0% of the top 10,000 pages, and up to 100% for many languages, as of 2024. Virtually all countries and languages have 95% or more use of UTF-8 encodings on the web.

What is your site primary language?

Probably English though depends on who you want to reach with your content.

Are There Risks in Editing the WordPress site code?

Short answer is yes, but a few precautions will eliminate most of these and by no means should you be scared of giving it a go.

Anyone working with websites knows that before tinkering have an up to date back up. Whether that is a full back up with the hosing company, a back through a plugin (down loaded onto your laptop or desktop) or a partial back up of posts or pages via an XML file.
When you access the theme file editor in the dropdown in the appearance tab in your WordPress dashboard. It will look like this:

As soon as you have this on your screen accidental keystrokes can edit the code so take a little care.

Check you are editing the correct theme in the dropdown menu top right.

Navigate to header.php (see image)

Now take a screenshot of this page so if you make any inadvertent changes you can spot them on the original screenshot.

Finally as a safeguard no changes made to the theme can take effect unless you confirm by clicking the “update” if you simply navigate away from the page without updating the theme remains unchanged.

Generate the Meta Tags and Their Appearance

The generated meta tags formatted in html should look like this. Copy to your clipboard.

How to Insert Meta Tags in the Header

Once you are on the correct page position the cursor after the green <head> text in our example on Line 11.

Make sure the line is empty and hit return to generate a new line, everything moves down, now repeat two more time to give a total of three empty lines.

Now go to line 12 on our example and paste the meta tags in html format.

Now click the blue update file box at the bottom, if its a big header you may have to scroll down to find it.

When the theme has been updated t should look like this. If you navigate away from the screen before seeing the image below the changes will be lost.

Now to check if you have succeeded goto ‘visit site’ from the dashboard and view the page in your browser. Clicking on ‘view source code’ you will be able to view the code you have inserted.