Enhancing navigation for your visitors is essential for any website owner. In this guide, we will demonstrate how to create an HTML sitemap page in WordPress.
This is not the technical sitemap used by search engines; instead, it is tailored specifically for users exploring your content.
An HTML sitemap is a single page that clearly lists all your significant posts and pages, serving as a user-friendly guide to everything you provide.
We highly recommend implementing this as a quick and effective way to enhance user experience. It’s a straightforward step that brings noticeable advantages for your audience.
Let’s dive in together. We will explore two different methods to accomplish this, with detailed steps.
What is the Difference Between XML and HTML Sitemaps?
An XML sitemap is a file that organizes your website content in XML format for search engines like Google and others.
You can submit your XML sitemap through webmaster tools to enhance and manage how search engines index your website.
Conversely, an HTML sitemap is designed for your website visitors. It is a straightforward page that organizes all your posts and pages for easy access.
Now that you understand the differences, let’s explore how to create an HTML sitemap page in WordPress using two different plugins. You can use the quick links below to jump directly to your preferred method:
- Creating an HTML Sitemap Page in WordPress Using All in One SEO
- Creating an HTML Sitemap Page in WordPress Using Simple Sitemap
- Frequently Asked Questions About HTML Sitemaps
Step 1: Create an HTML Sitemap Page in WordPress Using All in One SEO
We recommend the All in One SEO plugin for adding an HTML sitemap page in WordPress. It is the leading SEO plugin for WordPress, utilized by over 3 million websites, and allows you to create an HTML sitemap with just a few clicks.
Important Note:There is a free version of All in One SEO Lite available, which includes the HTML sitemap feature mentioned below. However, we will be using the premium version in our screenshots, as it offers advanced features like smart sitemaps, a redirection manager, SEO schema, and more.
The first step is to install the All in One SEO plugin. For detailed instructions, refer to our step-by-step guide on installing a WordPress plugin.
After activation, the AIOSEO setup wizard will launch, guiding you through the plugin setup and helping you configure your SEO settings.
Click the ‘Let’s Get Started’ button and follow the instructions provided.
You will then be directed to the WordPress admin dashboard, where a new menu option labeled ‘All in One SEO’ will appear.
Next, navigate to All in One SEO » Sitemaps, select the ‘HTML Sitemap’ menu option, and ensure that the ‘Enable Sitemap’ toggle is activated.
You can then choose your preferred display format for the HTML sitemap.
For this tutorial, we will opt for the ‘Dedicated Page’ option, but you also have the choice to use a shortcode, block, widget, and more.
After that, input the page URL where you would like the HTML sitemap to appear. The plugin will automatically generate a new page for you.
Once completed, scroll down to the ‘HTML Sitemap Settings’ section.
In this section, you can personalize how your HTML sitemap will look. You can control which posts and pages are included, manage taxonomies like categories and tags, set the sort order, and more.
You also have the option to enable ‘Compact Archives’ to present your HTML sitemap in a compact date archive format.
This format is similar to how we showcase our compact archives on our 404 pages here at CanadaCreate.
After finalizing your HTML sitemap settings, be sure to click the ‘Save Changes’ button.
Your visitors can now easily access your HTML sitemap, enhancing their navigation experience on your website.
If you selected the ‘Dedicated Page’ option earlier, you can access the page by clicking the ‘Open HTML Sitemap’ button.
Method 2: Create an HTML Sitemap Page in WordPress Using Simple Sitemap
Simple Sitemap is a free plugin that allows you to effortlessly add an HTML sitemap to your WordPress site.
First, you need to install and activate the Simple Sitemap plugin. For detailed instructions, refer to our beginner’s guide on installing a WordPress plugin.
After activating the plugin, you can either open an existing page or create a new HTML sitemap page by going to Pages » Add New.
Creating an HTML Sitemap Using Simple Sitemap with Blocks
This plugin includes Gutenberg blocks that make it easy to add an HTML sitemap page.
Simply click the ‘+’ icon and select the ‘Simple Sitemap’ option.
The plugin also includes a ‘Simple Sitemap Group’ block that generates a visual branching sitemap. However, for this tutorial, we will use the ‘Simple Sitemap’ block.
Once you add the block, your HTML sitemap will be automatically generated.
In the customization menu on the right, you can select to display either ‘Posts’, ‘Pages’, or both.
In the field labeled ‘Select post types to display’, enter either ‘Post’ or ‘Page’ to specify what you want to show.
Next, adjust how the list appears by selecting options from the ‘Orderby’ or ‘Order’ dropdown menus.
You can choose to display excerpts for the listed pages or posts and enable or disable links. However, we will stick with the default settings of the plugin to keep our HTML sitemap straightforward and user-friendly.
Once you have completed the customization of your HTML sitemap page, click ‘Publish’ or ‘Save’ if you are updating an existing page.
When your visitors access your HTML sitemap, they will encounter a navigation page that resembles the example shown below.
Integrating an HTML Sitemap Using Simple SitemapShortcodes
Another method to incorporate an HTML sitemap into WordPress is by utilizing a shortcode. This approach offers greater flexibility in positioning your HTML sitemap and is suitable for users of the classic editor.
To begin, create a new page by going to Pages » Add New, and then assign a name to your new page.
After that, click the ‘Plus’ icon to insert a new block into your page.
Next, enter ‘shortcode’ in the search bar and choose the ‘Shortcode’ block.
Then, copy and paste one of the following shortcodes into the text editor. The first shortcode will organize your posts by category, while the second will display your pages.
[simple-sitemap-group]
[simple-sitemap]
After completing this, click ‘Publish’ or ‘Update’ to save your changes.
For additional assistance, check out our guide on how to add a shortcode in WordPress.
This is how the plugin will present your sitemap to visitors on your website.
Creating an HTML Sitemap Using Simple Sitemap for Key Pages Only
Many website owners utilize WordPress as a content management system, with their primary content published as pages rather than posts. For more information, refer to the differences between posts and pages in WordPress.
In this scenario, you will want your HTML sitemap to display pages in the correct hierarchical structure.
Here’s how to incorporate an HTML sitemap that includes only pages.
Simply insert this shortcode into the page where you wish to showcase your HTML sitemap. Follow the same steps mentioned earlier to add the shortcode to a new WordPress page:
[simple-sitemap]
This feature will display your HTML sitemap, showcasing all your WordPress pages in a structured list.
It also presents your parent and child pages in a nested format. For more information, check out our guide on creating a child page in WordPress.
HTML Sitemap Frequently Asked Questions
We understand you may have additional questions about creating an HTML sitemap in WordPress. Here are answers to some of the most frequently asked questions.
1. What distinguishes an HTML sitemap from an XML sitemap?
An HTML sitemap is a visible page on your website designed to assist visitors in easily locating content. In contrast, an XML sitemap is a file specifically intended for search engines like Google, helping them discover and comprehend your site’s structure more effectively.
2. Is an HTML sitemap beneficial for SEO?
Absolutely. While the HTML sitemap is designed for users, it enhances the user experience by making navigation easier. This can result in visitors spending more time on your site and viewing additional pages, which are positive signals that can indirectly improve your SEO rankings.
3. Does the HTML sitemap automatically update when new content is added?
Absolutely! One of the greatest advantages of using plugins like All in One SEO or Simple Sitemap is their ability to automatically refresh your sitemap whenever you publish a new post or page. This ensures your sitemap remains up-to-date without any extra effort on your part.
4. Where should I place my HTML sitemap?
The ideal and most effective location to link your HTML sitemap is in the footer of your website. This allows visitors to access it from any page without overcrowding your main navigation menu.
5. How can I include my new HTML sitemap page in my navigation menu?
After publishing your sitemap page, you can easily add it to any menu by navigating toAppearance » Menusin your WordPress admin dashboard. Simply locate the sitemap page in the list on the left, check the box, and add it to your chosen menu.
Expert Tips for Enhancing WordPress Navigation
We hope this article has helped you understand how to create an HTML sitemap page in WordPress. You might also find these additional guides useful for enhancing your WordPress navigation:
- How to Create a Visual Sitemap in WordPress
- How to Add Breadcrumb Navigation Links in WordPress
- How to Add Next/Previous Links in WordPress (Ultimate Guide)
- Adding Arrow-key Navigation in WordPress: A Step-by-Step Guide
- Creating a Table of Contents for Your WordPress Posts and Pages
- Beginner’s Guide to Adding a Navigation Menu in WordPress
- How to Build a Vertical Navigation Menu in WordPress
- Creating a Sticky Floating Navigation Menu in WordPress
- Step-by-Step Guide to Adding a Mega Menu to Your WordPress Site
If you enjoyed this article, consider subscribing to our YouTube Channel for WordPress tutorials. Connect with us on Twitter and Facebook.
