The easy & quick way to add an HTML sitemap in WordPress

Are you looking for an easy and quick way to add an HTML Sitemap in WordPress? If yes, this guide is the perfect fit for your query. 

An HTML sitemap is a webpage that includes all the posts and pages of your site in an organized way and helps you facilitate user navigation on your site, boosting the user experience. This sitemap is different from the XML sitemap that you submit to search engines to boost your site’s crawlability. More on this later.   

Here, in this guide, we’ll discuss what HTML sitemaps are, why they are important, how they differ from XML sitemaps, and how you can add an HTML sitemap in WordPress in the most-simplest manner. 

So, without further digressing, Let’s begin!

What is an HTML Sitemap?

An HTML sitemap is a webpage that includes all the posts and pages of your site in an organized way. It is similar to a table of content and helps users to discover everything on your site effortlessly and facilitate their navigation on your site.

HTML sitemaps are primarily created for users and help them find the information they are looking for in an effortless manner.

How do HTML and XML sitemaps differ? 

Both XML and HTML sitemap are files similar to a roadmap that are used to understand the structure and content of a website. However, the major difference is their intended audience. 

HTML sitemaps are designed for website users and are presented in an organized and appealing way to help users find the information easily. These include content titles along with a short and catchy description of each page to give an overview to users. 

On the contrary, XML sitemaps are designed for search engines and include a list of important URLs that helps search crawlers discover and crawl your pages efficiently.  

Both types of sitemaps, HTML as well as XML sitemaps, are valuable from an SEO perspective. However, HTML sitemaps are more important for user experience. They help visitors find what they’re looking for quickly and easily, which can increase engagement and ultimately lead to more conversions.

How to add an HTML Sitemap to WordPress?

Now that you’ve understood what an HTML sitemap is and why it is valuable for websites, it’s time to create and add an HTML sitemap to your site.

Install and activate the Simple Sitemap plugin.

To create and add a sitemap, you’ll need to download the ‘Simple Sitemap’ plugin on your site. It’s a free and efficient plugin that allows you to add an HTML sitemap to WordPress easily. 

To get started with ‘Simple Sitemap,’ first install and activate it on your site. You can refer to our easy guide on installing a plugin in WP if you need help with plugin installation. 

Upon plugin activation, you can either open an existing HTML sitemap or create a new one. 

To create a new HTML sitemap, simply navigate to Pages >> Add New. 

• Add an HTML Sitemap using Simple Sitemap Blocks. 

Once you click on the add new, the plugin has added blocks that you can use to add an HTML sitemap.

Now, on the page editor, click on the ‘+’ icon and then search for the ‘Simple Sitemap’ block.

The plugin also adds another block with the name ‘Simple Sitemap Group.’ This block allows you to create a branching visual sitemap. 

For now, we are using the ‘Simple Sitemap’ block.

Now, go ahead and add the ‘Simple Sitemap’ block. Once done, it will automatically create your HTML sitemap.

Now you can customize the settings from your right menu to specify where you want to display ‘post,” Pages,’ or both.

Then, look for the option ‘Select post types to display’ and enter what you want to display, a ‘Post’ or ‘Page.’

Now, you can change the appearance of the page list from the ‘Order by’ or ‘Order’ drop-down menu.

In addition, you can show the excerpt of the listed posts or pages and enable or disable the links as per your preference.

For now, we are keeping the default plugin settings as it is to keep our sitemap straightforward and easy to use. 

Once you are happy with your customizations, don’t forget to click on ‘Publish’ if you’ve created a new sitemap or ‘Save’ tab if you are editing your existing HTML sitemap.

Now you can go to your website to see your HTML sitemap in action. 

• Add an HTML Sitemap with Simple Sitemap using Shortcodes 

Simple Sitemap also allows you to add the HTML Sitemap using Shortcodes. This method is more effective for WordPress users using the Classic editor and gives more flexibility over the sitemap’s placement.

To begin with, this method, navigate to Pages >> Add New to create a new page and then provide a name for your page. Once done, you need to add a new block to the page. 

For this, click on the ‘+’ icon. After that, look for the ‘Shortcode’ block.

Here are the codes you’ll need in the next step.

[simple-sitemap-group]

[simple-sitemap]

Now, copy any one of the shortcodes provided above and then paste it into the text editor.

The first shortcode lists your posts by category, while the second code simply lists your pages.

Now, click on the ‘Publish’ or ‘Update’ tab to store your settings. Now you visit your site to see how your HTML sitemap will appear.

That’s it. You have successfully created and added an HTML sitemap to your WordPress site.

• Create an HTML sitemap for top pages only (In hierarchical order)

The plugin Simple Sitemap also allows you to add the HTML sitemap in a hierarchical manner. 

If you usually publish your site content in Pages, you may want to display your pages in your HTML sitemap in a properly organized manner.

This is how you can create a hierarchical HTML sitemap for your top web pages.

You’ll need this shortcode in the next step.

[simple-sitemap]

Now, follow the same process you used above to add the shortcode to a new WP page.

In order to add a hierarchical HTML sitemap for your top web pages, you need to add the above shortcode to the page.

Once done, save your changes and see how the hierarchical HTML sitemap of your top pages will appear on your website. 

Note that your HTML sitemap also includes your website’s parent and child pages in a nested manner.

That’s it. You have successfully added a hierarchical HTML sitemap for your top web pages.

To conclude!

So, this is how you can effortlessly create and add an HTML sitemap to your site with the Simple Sitemap plugin. Adding an HTML sitemap might seem daunting at the beginning, but it’s much easier with a Simple Sitemap plugin.

Adding an HTML sitemap to your site is a smart way to improve your site’s SEO and user experience. This is because an HTML sitemap facilitates user navigation. By providing visitors with a clear and easy-to-use table of contents, you can increase engagement and ultimately drive more conversions. 

Here we’ve covered the process in a step-wise manner to help you understand it better. Now, you may quickly add an HTML sitemap to your WordPress site using the Simple sitemap plugin and the simple steps we mentioned above in no time.

We hope that this simple and quick tutorial on how to build an HTML Sitemap in WordPress helped you in learning the whole process and assisted you in adding an HTML sitemap to your site effortlessly.