Using WordPress Sitemaps – Step by Step

  • 13 min read
  • by

Introduction

A sitemap is a list of URL links of all the pages of a website. There are two kinds of sitemaps – XML sitemaps and HTML sitemaps. XML sitemaps are used by web crawlers (usually by search engine bots) to index sites and search for content. HTML sitemaps, on the other hand, are used by people to navigate the contents of a webite. Both are important.

In this tutorial, we will learn how to generate and make use of both types. For XML sitemaps we will use Yoast SEO and Google XML Sitemaps to generate sitemaps. Then we will learn how to use webmaster tools – Google Search Console and Bing Webmaster Tools – to inform search engines about the these sitemaps Lastly, we will learn to generate and use an HTML sitemap with WP Sitemap Page.

With that, let’s begin!

Generating and Using XML Sitemaps

In this section, we will be learning how to create and use XML sitemaps. First, with Yoast SEO, then with Google XML Sitemaps.

Using Yoast SEO to Generate a Sitemap

In this subsection, we will learn how to create a sitemap with Yoast SEO.

Installing Yoast SEO

To be able to use Yoast SEO, it needs to be installed and activated. Here’s how to do that. From the admin dashboard, hover over “Plugins” and then click “Add New”. You will be redirected to the “Add Plugins” page. Type “Yoast SEO” in the “Search plugins” textbox. Once the result’s show up, look for “Yoast SEO”

Search for "Yoast SEO"

Click “Install Now” on the plugin’s section to install.

Install "Yoast SEO"

Click “Activate” after.

Activate "Yoast SEO"

Yoast SEO can now be used.

Generating an XML Sitemap with Yoast SEO

We can now generate an XML sitemap with Yoast SEO. To do so, hover over “SEO” and click “General”

Click "General"

This will redirect to the “General – Yoast SEO” dashboard page. From there click on “Features”. You will see the different features that Yoast SEO has.

Check out the features

Look for the “XML sitemaps” feature.

Check out "XML sitemaps" feature

Click on the question mark icon on the right of the “XML sitemaps” label.

Click on the question mark icon

This will reveal the XML sitemaps feature’s help panel. Click on “See” the XML sitemap.” link

Click on the first link

This will show the WordPress site’s XML sitemap.

Overview: WordPress site's XML sitemap

Alternatively, the sitemap can be seen by appending the site’s root page with “/sitemap_index.xml”. In the example below, “localhost/wp-test” is the root of our site. so we appended the URL accordingly

Alternativ way to see the sitemap

Click on a sitemap link to view the URLs that it contains.

Click on a sitemap

Using Google XML to Generate a Sitemap

In this subsection, we will learn how to create a sitemap with Google XML

Installing Google XML Sitemaps

To install Google XML, search for it in the “Add Plugins” page.

Search for the "Google XML" Plugin

Click “Install Now” in the “Google XML Sitemaps” section

Install "Google XML Sitemaps"

Then click “Activate”

Activate "Google XML Sitemaps"

Generating an XML Sitemap with Google XML Sitemap

The Google XML Sitemap automatically creates an XML sitemap, when the plugin is activated.

To view the generated sitemap, from the admin dashboard, hover over “Settings” then click “XML-Sitemap”

Click on "XML Sitemap"

This will redirect to the “XML Sitemap Generator” page. The URL to the sitemap can be found near the top of the page. To make it easier, press CTRL + F and look for this string: “The URL to your sitemap index file is:”.

XML Sitemap Generator

Copy and paste that URL to a web browser’s address bar and press ENTER. In our example, the URL is: http://localhost/wp-test/sitemap.xml. We will copy and paste that address on our browser, and then we will press ENTER.

Copy and pate the URL

Alternatively, the “/sitemap.xml” string can be appended to the WordPress site’s root URL. In the example below our site’s root url is “localhost/wp-test”. We will append the sitemap string. Thus;

Alternativ: Append the "/sitemap.xml" string to the site's root URL.

Click on a sitemap link to view the URLs that it contains.

Choose a sitemap link

(Optional) Google XML Sitemap Settings

The plugin can be further configured. To do so, click on the “XML-Sitemap” link found in the main dashboard’s “Settings” tab.

Below are the plugin’s basic options:

Google XML Sitemap Settings

The plugin can also be configured to include additional pages.

Settings additional pages

The plugin can also be configured to specify which contents to include in the XML Sitemap.

Choose content

It also allows for exclusion of content in the XML sitemap.

exclusion of content

Lastly, we can assign the priorities of the XML sitemap’s content.

assign the priorities

To save the plugin’s configuration settings, click the “Update Options” button at the bottom of the page.

save configuration settings

For further settings be sure to check the page.

Informing a Search Engines of XML an Sitemap

In this section, we will learn how to inform a search engine of a WordPress site’s XML sitemaps

Downloading and Activating the “Insert Headers and Footers” plugin

Prior to letting search engines know of the XML sitemap. We will embedded our WordPRess

We need to install and activate the Insert Headers and Footers plugin. It will be used to embedded tags needed for site ownership verification. Search for the plugin in the “Add Plugins” page.

Search for Insert Headers and Footers Plugin

Click, “Install Now” in the “Insert Headers and Footers” section.

Install the plugin

Click ‘Activate’

Activate the plugin

Informing Google of the XML Sitemap

(Optional) Using Ngrok to expose a local server

This subsection is optional but very important.

Google Search Console is a service offered by Google to help webmasters index a site and optimize its visibility. It is where XML Sitemaps are submitted to so that Google can crawl and index a site. However, Google Search Console cannot work with locally deployed WordPress sites. There is a way to work around this however. We can use Ngrok. Ngrok is a free tool (a tunneling service tool) which allows us to access a site as if it was deployed on a production server. (There is also a paid version, but for development purposes the free version is sufficient). Here is how to set it up. (Take note that you have to sign up for an Ngrok account to be able to maximize Ngrok’s use). Copy the directory of Ngrok in your Environment System Variables (particularly the “Path” system variable. After doing that, Ngrok can be access from the command line. It’s documentation page can be access by this link. Here is the link to the official tutorials, only accessible once you’ve signed up, to help get started.

(Note: you may experience issues when trying to access the XML sitemap using the tunneling service’s generated URL. This seems to be due to XML sitemap’s xsl file. Most modern web browsers show an error message or a blank page. This does not happen with Internet Explorer 11.) We suggest using that browser for testing purposes)

Informing Google of a WordPress Site’s XML Sitemap

In this subsection, we will use the Google Search Console to let Google know of a WordPress site’s sitemap.

First, create a Google Account. After that, go to the Google Search Console page.

Once there, click on the the “URL prefix” property type.

Choose "URL prefix"

Enter your site’s URL then click “Continue”

Check your URL

Next, we will need to verify our ownership of the site. We need to choose a verification method. We will choose the “HTML tag” verification found under the “HTML file” option.

Choose the "HTML tag" verification

Copy the code on the first step.

Copy the code

Next, open a new tab or window. In the new tab or window navigate to the WordPress admin dashboard. From the Admin dashboard, hover over “Settings” and click “Insert Headers and Footers”

Navigate to: plugins - settings - Insert Headers and Footers

You will be redirected to the “Insert Headers and Footers” settings page.

Settings page from the Insert Headers and Footers plugin

Paste the code that was copied from the Google Search Console page inside the “Scripts in Header”

paste the code inside the first field

Click the “Save” button on the bottom of the page, to apply the settings.

save the settings

Next, return to the Google Search Console page then click “Verify”.

Verify ownership at the Google Search Console

If the site’s ownership was successfully verified, a windows showing a message confirming the verification will appear.

Message: Ownership auto verified

We can now add an XML sitemap. Click the “Go to Property” button. It will redirect to the Google Search Console dashboard.

choose "sitemaps" at the sidebar

Click on the “Sitemaps” link on the side of the page.

click on the sitemaps link - Using WordPress Sitemaps - Step by Step

We will be redirected to the Google Search Console’s Sitemap page. Add the URL of the sitemap, inside the “Add a new sitemap” section. After that, click “Submit”.

Google Search Console Sitemap page

If the XML sitemap was successfully submitted, a message saying the sitemap was submitted successfully will be shown.

Message: Sitemap submitted successfully

We’ve successfully submitted the sitemap to Google.

Informing Bing of a WordPress Site’s XML Sitemap

in this subsection, we will learn to inform Bing of a WordPress site’s XML sitemap.

Go to the Bing webmaster tools page. Sign up for an account, if you don’t have one. After signing up for an account (or logging in), you will be redirected to the “My Sites” page of the Bing webmaster tool.

Type the URL of the site, whose XML Sitemap you will let Bing know of, on the “Add a Site” section of the page. Click “Add” after.

Type the URL on the "Add a Site" section

The page will redirect to the “Add a Site” page.

Bing webmaster "Add a Site" page

Type the address of the sitemap’s URL in the “Add a sitemap” field.

fill in the fields

Click “Save” at the bottom of the page.

save the settings

It will redirect to the “Verify Ownershop” page. There are multiple ways to verify ownership.

different ways to verify

We will use the second method – copying a meta tag on a web page. Copy the meta tag.

copy a meta tag

Open a new tab or page and open the WordPress admin dashboard. From there, hover over “Settings” and click the “Insert Headers “

open plugin settings

It will redirect to the “Insert Headers and Footers” settings. Paste the meta code that was copied from the inside the “Scripts in Header” section of the page.

paste the meta code in the first field

Click the “Save” button on the bottom of the page.

save this

Now go back to Bing webmaster and click “Verify”.

Click verify at bing webmaster

After verifying it will redirect to the Bing webmaster Dashboard. Here you can see different site statistics.

Statistics at the bing webmaster dashboard

We’ve successfully submitted the sitemap to Bing.

Generating and Using HTML Sitemaps

In this section, we will learn how to create and use HTML Sitemaps. To do that, we will use the WP Sitemap Page plugin.

Installing WP Sitemap Page

We need to install the plugin first. From the admin dashboard, hover over “Plugins” and click “Add New”. You will be redirected to the “Add Plugins” page. Type “WP SItemap Page” in the “Search plugins…” textbox.

Search for the Wp Sitemap Page plugin

Click on “Install Now” on the “WP Sitemap Page” section.

Install the plugin

After that, click “Activate”

activate the plugin

Using WP Sitemap Page to DIsplay an HTML Sitemap

To display an HTML sitemap, copy this shortcode:

[wp_sitemap_page]
Code language: JSON / JSON with Comments (json)

and paste it on a page or post in its respective block editor. In our example below, we pasted the shortcode in a page’s block editor.

display an HTML sitemap

Here is what the generated HTML sitemap looks like.

the generated HTML sitemap

For more shortcodes, view the “How to use” tab in the WP Sitemap Page. To get there, from the admin dashboard, hover over “Settings” then click the “WP Sitemap Page”. This will redirect to the “WP Sitemap Page” Click on “How to use”, a list of shortcodes will be presented.

click "how to use"

Below are the different shortcodes.

overview different shortcodes

We have created and used an HTTL Sitemap using WP Sitemap Page.

Conclusion

We’ve finished the tutorial. We’ve learned a lot about XML and HTML sitemaps. We’ve learned what they are for, how to generate them and how to use them.

nv-author-image

Kristin Eitel

Leave a Reply

Your email address will not be published. Required fields are marked *