Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

How to Add an HTML Sitemap Page in WordPress (2 Ways)

Editorial Note: We earn a commission from partner links on WPBeginner. Commissions do not affect our editors' opinions or evaluations. Learn more about Editorial Process.

Do you want to add an HTML sitemap page in WordPress?

Unlike XML sitemaps that are submitted to search engines for better crawling, HTML sitemaps present an organized list of your pages and posts for your website visitors.

In this article, we will show you how to add an HTML sitemap page in WordPress.

How to add an HTML sitemap page in WordPress

What’s the Difference Between XML and HTML Sitemaps?

An XML sitemap is a file that lists your website content in an XML format for search engines like Google and others.

You can submit your XML sitemap in webmaster tools to improve and control how the search engines crawl your website.

On the other hand, an HTML sitemap is for your actual website visitors. It is a simple page that lists all your posts and pages in an organized way.

Now that you know the difference, let’s take a look at how to add an HTML sitemap page to WordPress using two different WordPress plugins. You can use the quick links below to jump straight to the method you want to use:

Video Tutorial

Subscribe to WPBeginner

If you’d prefer written instructions, then just keep reading.

Method 1: Add HTML Sitemap Page in WordPress With All in One SEO

We recommend using the All in One SEO plugin to add an HTML sitemap page in WordPress. It’s the best WordPress SEO plugin on the market, used by over 3 million websites, and it lets you create an HTML sitemap with a couple of clicks.

Note: There is a free version of All in One SEO Lite available, which includes the HTML sitemap feature below, but we will be using the premium version in our screenshots because it includes powerful features like smart sitemaps, redirection manager, SEO schema, and more.

The first thing you need to do is install the All in One SEO plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, the AIOSEO setup wizard will open, which will guide you through setting up the plugin and getting your SEO settings right.

Simply click the ‘Let’s Get Started’ button and follow the steps.

AIOSEO setup wizard

After that, you’ll be taken to the WordPress admin dashboard, where you’ll have a new menu option called ‘All in One SEO’.

Then, you need to go to All in One SEO » Sitemaps, click on the ‘HTML Sitemap’ menu option, and make sure the ‘Enable Sitemap’ toggle is turned on.

Enable HTML sitemap

Next, you can choose how you want to display your HTML sitemap.

For this tutorial, we will select the ‘Dedicated Page’ option, but you can also add it as a shortcode, block, widget, and more.

Then, enter the page URL where you want the HTML sitemap to display. The plugin will automatically create a new page for you.

Enter URL for HTML sitemap page

Once you’ve done that, scroll down to the ‘HTML Sitemap Settings’ section.

Here, you can customize how your HTML sitemap will display. You have control over what posts and pages will display, taxonomies such as categories and tags, sort order, and more.

Customize HTML sitemap settings

You can also turn on ‘Compact Archives’ to display your HTML sitemap in a compact date archive format.

This is similar to how we display our compact archives on our 404 pages here at WPBeginner.

After you are done customizing your HTML sitemap settings, make sure to click the ‘Save Changes’ button.

Save custom HTML page settings

Now, your visitors can view your HTML sitemap and more easily navigate around your website.

If you chose the ‘Dedicated Page’ option above, then you can visit the page by clicking the ‘Open HTML Sitemap’ button.

HTML sitemap example page

Method 2: Add HTML Sitemap Page in WordPress With Simple Sitemap

Simple Sitemap is a free plugin that lets you easily add an HTML sitemap to your WordPress website.

The first thing you need to do is install and activate the Simple Sitemap plugin. For more details, see our beginner’s guide on how to install a WordPress plugin.

Once the plugin is activated, you can open an existing page or create a new HTML sitemap page by navigating to Pages » Add New.

Adding an HTML Sitemap With Simple Sitemap Using Blocks

This plugin has Gutenberg blocks that you can use to simply add an HTML sitemap page.

All you need to do is click the ‘+’ icon, then select the ‘Simple Sitemap’ option.

Add simple sitemap block

Another block included with this plugin is the ‘Simple Sitemap Group’ that creates a branching visual sitemap. But we are going to use the ‘Simple Sitemap’ block for this tutorial.

Once you add the block, it will automatically create your HTML sitemap.

On the right-hand menu, you have customization options where you can choose to display ‘Posts’ or ‘Pages’, or both together.

In the box under ‘Select post types to display’, simply enter ‘Post’ or ‘Page’ to choose what you want to display.

Sitemap created add posts or pages

Next, you can change how the list displays by changing the ‘Orderby’ or ‘Order’ drop-downs.

You can also display the excerpt for the pages or posts listed and enable or disable links. However, we are going to keep the default plugin settings to keep our HTML sitemap simple and easy to browse.

Customize sitemap order and appearance

Once you’ve finished customizing your HTML sitemap page, click ‘Publish’ or ‘Save’ if you are updating an older page.

When your visitors go to your HTML sitemap, they’ll see a navigation page that looks similar to the one below.

Final block sitemap example

Adding an HTML Sitemap With Simple Sitemap Using Shortcodes

Another way to add an HTML sitemap to WordPress is by using a shortcode. This gives you more control over the placement of your HTML sitemap and works for those who are using the classic editor.

Simply create a new page by navigating to Pages » Add New, then give your new page a name.

Add new block for HTML sitemap

After that, click the ‘Plus’ icon to add a new block to your page.

Then, type ‘shortcode’ into the search box and select the ‘Shortcode’ block.

Add shortcode block

After that, simply copy and paste one of the following shortcodes into the text editor. The first shortcode will list your posts by category, and the second shortcode will list your pages.

[simple-sitemap-group]

[simple-sitemap]
Paste shortcode and publish

Once you’ve done that, click ‘Publish’ or ‘Update’ to save your changes.

If you need more help, then see our guide on how to add a shortcode to WordPress.

This is how the plugin will display your sitemap to your website visitors.

HTML sitemap posts and pages

Creating an HTML Sitemap With Simple Sitemap for Top Pages Only

Many site owners use WordPress as a CMS, with their main content published as pages instead of posts. For more details, see the difference between posts and pages in WordPress.

In this case, you would want your HTML sitemap to show pages in the proper hierarchical order.

Here is how you can add an HTML sitemap with only pages.

Simply add this shortcode to the page where you want to display your HTML sitemap. Follow the same steps above to add the shortcode to a new WordPress page:

[simple-sitemap]

This is how it will display your HTML sitemap with all your WordPress pages listed in a hierarchical list.

HTML sitemap page example

It also includes your parent and child pages listed in a nested fashion. For more details, see our guide on how to create a child page in WordPress.

Expert Guides on Improving WordPress Navigation

Now that you know how to add an HTML sitemap page, you may like to see some other guides related to improving WordPress navigation.

We hope this article helped you learn how to add an HTML sitemap page in WordPress. You may also want to see our expert picks of the best virtual business phone number apps and our guide on how to choose the best blogging platform.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

21 CommentsLeave a Reply

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Robert Thompson says

    WordPress wants me to pay them $300 just to upgrade to their business plan so that I can have access to their plugins. I’ll pass on their offer.

    • WPBeginner Support says

      The second plugin from this article should allow you to separate the content by category.

      Admin

  3. Carol says

    Cannot get POSTS to show like pages do, so it’s useless for me. On my site, pages are static stuff, About, etc. But posts are the new items that people want to see right away. I do research on various topics and that is the heart and soul of my blog. I want them to see the new stuff in order on that subject, in a list. I really don’t care about Pages, Privacy, Cookies, About, stuff you look at once, maybe, if ever

    I have experimented with the code, get only the CODE on the finished page.

    What can I do?

  4. Shawn says

    I’d like to generate a sitemap page with all my woocommerce shop categories and products. Can this plugin do that?

  5. ibu solihatun says

    The article is very interesting. Helped me understand many things and will be happy soon to write like again.

  6. Memory says

    Thank you so very much, this site map is amazingly fine-tuned, absolutely perfect, and saved me a great deal of time.

  7. Blane Beckwith says

    I added an HTML site map to my webpage, and it made a very nice looking, and functional archive page.

  8. Connor Rickett says

    Never a bad idea to have a sitemap for your visitors. Just as a side note, when/if you submit your sitemap to Google, make sure it’s the XML one!

  9. Natascha says

    What I do miss though is, why would someone need a HTML sitemap or when is it recommended? Maybe a short pro and cons list would help. Thanks

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.