Imagine stepping into a massive department store with absolutely no signs, aisle numbers, or directory maps. You’d probably wander around frustrated for five minutes before walking out empty-handed. The exact same scenario occurs when a user lands on a content-heavy website lacking a clear structural guide. If you want to keep visitors on your site longer, streamline navigation, and boost your rankings, learning how to create a sitemap page in wordpress is one of the most practical steps you can take.
To set up your site correctly, we must first clear up a common point of confusion. There are two distinct types of sitemaps: XML sitemaps and HTML sitemaps.
An XML sitemap is written in structured, machine-readable code. It lives behind the scenes—typically at /sitemap.xml—and is designed specifically for search engine bots like Googlebot. You submit this file directly to search consoles so crawler bots know exactly which URLs exist on your server. It does not look pretty, nor is it meant for human eyes.
An HTML sitemap page, on the other hand, is a fully rendered, styled web page on your site (typically published at /sitemap/) designed for real human visitors. It displays an organized, clickable directory of your site’s hierarchy, displaying pages, blog posts, categories, and custom archives. While its main purpose is to help humans discover deep-seated content, search engine crawlers absolutely love them because they provide a powerful network of clean, crawlable internal links.
Why Your WordPress Site Needs a Sitemap Page (HTML vs. XML)
Creating an HTML sitemap page offers massive SEO and UX benefits:
- Distributes PageRank (Link Equity): High-authority pages (like your homepage) can pass link juice down to your HTML sitemap, which then redistributes that equity to older, buried blog posts.
- Improves Indexing Speed: When search bots crawl your sitemap page, they can easily discover new or updated posts that might otherwise take days to get indexed.
- Eliminates Orphan Pages: An "orphan page" is a page with zero internal links pointing to it. Since a sitemap lists all pages, it guarantees that every single piece of content has at least one permanent internal link.
- Reduces Bounce Rates: If a user is lost, lands on a 404 page, or is looking for a comprehensive directory of your site, the sitemap page serves as an intuitive roadmap, keeping them on your site longer.
In this guide, we will walk you through the exact step-by-step methods to create a sitemap page in wordpress, covering the top SEO suites, dedicated lightweight plugins, and custom, code-based approaches that require no plugins at all.
How to Create an HTML Sitemap in WordPress with Top SEO Plugins
Because almost every WordPress site utilizes an SEO plugin, this is the easiest route to execute. Two of the most popular SEO plugins—Rank Math and All in One SEO (AIOSEO)—offer built-in, automated HTML sitemap generators.
1. Creating an HTML Sitemap with Rank Math
Rank Math handles XML schemas, metadata, and redirections, and it features an excellent, lightweight tool that builds a clean HTML sitemap page automatically. Here is how to configure it:
Step 1: Activate the HTML Sitemap Feature From your WordPress admin dashboard, navigate to Rank Math SEO > Sitemap Settings. Click on the HTML Sitemap tab at the top. Ensure the toggle next to HTML Sitemap is switched to On.
Step 2: Choose Your Display Method Rank Math gives you three primary display methods:
- Shortcode: Copy the
[rank_math_html_sitemap]shortcode to paste anywhere. - Gutenberg Block: Insert a block directly in the block editor.
- Page: Let Rank Math completely generate and host the sitemap at a set URL.
We highly recommend using the Shortcode or Gutenberg Block method because it allows you to design a custom, beautiful page template that perfectly matches your brand, rather than relying on a blank, default plugin template.
Step 3: Select Your Content Types Scroll down to the Content to Show settings. Here, you can check the boxes for the exact post types you want to include. For most sites, you should select Pages, Posts, and Categories. Avoid adding attachments, custom landing page types, or tags unless you have a specific strategic reason to do so.
Step 4: Set the Sort Order Choose how you want your links ordered. Sorting alphabetically by Title is the most intuitive configuration for users searching for specific terms. Alternatively, you can sort by Publish Date to prioritize your newest articles.
Step 5: Exclude Specific Pages You must exclude thin utility pages like your checkout, shopping cart, private member portals, and thank-you pages. Under the Exclude Posts input box, enter the specific Page/Post IDs (separated by commas) of any content you wish to hide from the public directory.
Step 6: Deploy Your Sitemap Page
Navigate to Pages > Add New. Title your page "Sitemap" or "Site Directory". Add a custom introductory text paragraph to explain what the page is, then insert the native Gutenberg block named HTML Sitemap (Rank Math), or insert a Shortcode block and paste [rank_math_html_sitemap]. Click Publish.
2. Creating an HTML Sitemap with All in One SEO (AIOSEO)
All in One SEO (AIOSEO) provides a polished, interactive interface to generate highly organized directories with excellent visual styles.
Step 1: Access the HTML Sitemap Settings Go to All in One SEO > Sitemaps in your WordPress sidebar. Click on the horizontal tab labeled HTML Sitemap.
Step 2: Enable the Feature Toggle the Enable Sitemap switch to the active (blue) state.
Step 3: Select Your Layout and Format AIOSEO offers unique styling controls. You can toggle Compact Archives on. If you have thousands of blog posts, this option prevents your page from turning into an endless wall of text by cleanly grouping posts into collapsible folders by year and month.
Step 4: Configure Display Settings
Select your presentation method. Under Display Method, choose whether you want to use a Dedicated Page (AIOSEO will auto-generate /sitemap/), a Gutenberg Block, a Shortcode ([aioseo_html_sitemap]), or a Widget for your footer.
Step 5: Set Inclusion and Exclusion Rules Under Sitemap Settings, you can toggle "All Post Types" or manually select individual items. To hide utility pages, toggle the Advanced Settings switch. In the Exclude Posts box, search for and select the pages (like your terms of service or cart) that you do not want search engines to focus on. Save your changes.
How to Create a WordPress Sitemap Page Using Dedicated Lightweight Plugins
If you use Yoast SEO (which does not support HTML sitemaps out of the box in its free version) or prefer a completely separate, specialized plugin, using a lightweight utility plugin is your best option. These plugins focus purely on styling and customization options.
1. Utilizing the 'Simple Sitemap' Plugin
"Simple Sitemap" by David Gwyer is a top-rated, responsive plugin designed exclusively for this task.
Step 1: Install and Activate the Plugin Navigate to Plugins > Add New in your WordPress dashboard. Search for Simple Sitemap. Install and activate the plugin.
Step 2: Create a New Page Go to Pages > Add New. Title the page "Sitemap".
Step 3: Insert the Simple Sitemap Block Click the + block inserter icon inside the editor and search for Simple Sitemap. Once inserted, click on the block to view its customizable features in the right-hand sidebar menu:
- Post Types: Enter
page, postto show both standard pages and blog posts. - Show Title: Toggle on or off to show the list headers.
- Links Order: Sort by title or publish date.
- List Style: Choose from default bullets, decimal lists, or no styling at all.
Step 4: Customization via Shortcodes (Advanced)
For highly customized structures, the plugin offers excellent shortcode options. If you want to build a page-only sitemap organized alphabetically, use this shortcode:
[simple-sitemap post_type="page" orderby="title" order="ASC" depth="3"]
To build a separate section on the same page showing only your blog posts grouped by date, add another block and insert:
[simple-sitemap post_type="post" orderby="date" order="DESC"]
This gives you a beautiful, multi-tiered page structure without writing a single line of backend code.
How to Create a WordPress Sitemap Page Without a Plugin (Manual & Code-Based)
For developers, agency owners, and performance-driven creators, avoiding third-party plugins is the ultimate goal. Fortunately, WordPress provides native tools and simple PHP loops to build extremely fast, zero-bloat sitemaps.
Option A: The Native 'Page List' Block Method (Zero Code)
If you manage a small business website, landing page, or simple portfolio with fewer than 50 total pages, you do not need a plugin. WordPress features a native block designed specifically for this.
- Go to Pages > Add New and create a page named "Sitemap".
- Add a new block and search for Page List.
- When you insert this block, WordPress automatically queries your database and displays a real-time, nested hierarchical list of all published pages on your website.
- If you also publish blog posts, add a Heading block (H2) titled "Blog Directory" below your page list.
- Beneath the heading, add a Query Loop block.
- Click Start Blank inside the Query Loop and select the Title element only. Remove any featured image, date, or author blocks. This leaves you with a clean, bulleted list of post titles.
- Click on the Query Loop block, look at the right-side settings panel, and adjust the query to display 100 posts (or use pagination if you have more) and sort them alphabetically.
Because these blocks are baked directly into the core Gutenberg editor, they consume zero additional memory, guarantee lightning-fast load times, and dynamically update every time you publish a new page or post.
Option B: The Custom PHP Page Template Method (For Developers)
For large websites with complex layouts, creating a custom page template in your child theme is the cleanest, most scalable development practice.
- Connect to your server files via an FTP client (such as FileZilla) or use your hosting provider’s File Manager tool.
- Navigate to your active child theme folder:
/wp-content/themes/your-child-theme/. - Create a new file in this directory and name it
template-sitemap.php. - Open the file in a text or code editor and paste the following clean, database-efficient PHP script:
<?php
/*
Template Name: Custom HTML Sitemap
*/
get_header(); ?>
<div id="primary" class="content-area sitemap-container" style="max-width: 1100px; margin: 40px auto; padding: 0 20px;">
<main id="main" class="site-main" role="main">
<header class="entry-header" style="margin-bottom: 30px;">
<h1 class="entry-title" style="font-size: 2.5rem; color: #111;"><?php the_title(); ?></h1>
</header>
<div class="entry-content">
<div class="sitemap-columns" style="display: flex; gap: 50px; flex-wrap: wrap;">
<!-- Pages Column -->
<div class="sitemap-col" style="flex: 1; min-width: 300px;">
<h2 style="font-size: 1.8rem; border-bottom: 2px solid #0073aa; padding-bottom: 10px; margin-bottom: 20px; color: #222;">Website Pages</h2>
<ul style="list-style-type: none; padding-left: 0; line-height: 1.8;">
<?php
wp_list_pages(array(
'title_li' => '',
'exclude' => '2, 14, 25'
));
?>
</ul>
</div>
<!-- Blog Posts Column -->
<div class="sitemap-col" style="flex: 1; min-width: 300px;">
<h2 style="font-size: 1.8rem; border-bottom: 2px solid #0073aa; padding-bottom: 10px; margin-bottom: 20px; color: #222;">Articles by Topic</h2>
<?php
$categories = get_categories(array('orderby' => 'name', 'order' => 'ASC'));
foreach ($categories as $cat) {
$posts = get_posts(array(
'category' => $cat->term_id,
'numberposts' => -1,
'post_status' => 'publish'
));
if ($posts) {
echo '<h3 style="font-size: 1.2rem; margin-top: 20px; color: #444; text-transform: uppercase; letter-spacing: 0.5px;">' . esc_html($cat->name) . '</h3>';
echo '<ul style="list-style-type: square; padding-left: 20px; line-height: 1.6;">';
foreach ($posts as $post) {
setup_postdata($post);
echo '<li><a href="' . esc_url(get_permalink($post->ID)) . '" style="color: #0073aa; text-decoration: none;">' . esc_html(get_the_title($post->ID)) . '</a></li>';
}
echo '</ul>';
}
}
wp_reset_postdata();
?>
</div>
</div>
</div>
</main>
</div>
<?php get_footer(); ?>
- Save and upload the file back to your server.
- Open your WordPress dashboard, go to Pages > Add New, and title the page "Sitemap".
- In the right-hand settings sidebar, look for the Template dropdown menu (inside the "Summary" or "Page Attributes" section).
- Select your new Custom HTML Sitemap template.
- Publish the page. It will automatically compile all pages and categorized blog posts dynamically.
How to Find Your Page IDs in WordPress
In the PHP snippet or plugin configurations above, you are often asked to enter page IDs to exclude them. If you do not know how to find a page ID, follow this quick trick:
- Navigate to Pages > All Pages (or Posts > All Posts) in your admin dashboard.
- Hover your mouse cursor over the title of the page you want to exclude (do not click it).
- Look at the very bottom-left corner of your browser window. You will see a long destination URL that ends with something like
post.php?post=154&action=edit. - The number in that URL—in this case, 154—is the exact Page ID. Simply enter that number in your exclusion lists.
Optimization Best Practices: What to Include, Exclude, and Style
To ensure your WordPress sitemap page delivers maximum value to visitors and search crawlers, you should apply several deliberate design and technical optimizations.
1. What to Keep and What to Delete
A crowded, messy sitemap page dilutes your internal link power and degrades the user experience. You should be highly selective.
- Exclude immediately: Cart, checkout, payment confirmations, account settings, policy pages (privacy, cookies, terms), registration sheets, newsletter landing pages, and duplicate category/tag archives.
- Include strategically: Your core services, product category pages, primary landing pages, about page, contact form, knowledge base hubs, and main blog categories.
2. Styling Your Custom HTML Sitemap Page (CSS Snippets)
If you built your sitemap without a plugin or want to improve a plugin's basic output, apply these highly clean, modern CSS rules. You can add this code to your site by navigating to Appearance > Customize > Additional CSS (or inside your child theme's style.css file):
/* Custom Sitemap Styling */
.sitemap-container {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
color: #333;
}
.sitemap-columns {
display: flex;
flex-wrap: wrap;
gap: 40px;
margin-top: 30px;
}
.sitemap-col {
flex: 1;
min-width: 280px;
}
.sitemap-col h2 {
font-size: 1.6rem;
font-weight: 700;
color: #111;
border-bottom: 3px solid #0073aa;
padding-bottom: 10px;
margin-bottom: 20px;
}
.sitemap-col h3 {
font-size: 1.1rem;
font-weight: 600;
color: #555;
margin-top: 25px;
margin-bottom: 10px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.sitemap-col ul {
list-style-type: none !important;
padding-left: 0 !important;
}
.sitemap-col li {
margin-bottom: 10px;
padding-left: 15px;
position: relative;
font-size: 0.95rem;
}
.sitemap-col li::before {
content: "-";
color: #0073aa;
font-weight: bold;
position: absolute;
left: 0;
}
.sitemap-col a {
color: #333;
text-decoration: none;
transition: color 0.2s ease, padding-left 0.2s ease;
}
.sitemap-col a:hover {
color: #0073aa;
padding-left: 3px;
}
This clean styling structures your lists into elegant multi-column blocks on desktop, and wraps seamlessly to single columns on mobile devices, ensuring full accessibility and mobile responsiveness.
3. Add the Link to Your Global Footer
For an HTML sitemap to benefit your SEO, search crawler bots must be able to find and crawl it continuously. The standard best practice is to place a text link to your /sitemap/ page inside your website's footer navigation.
To do this:
- Go to Appearance > Menus in your dashboard.
- Select or create your Footer Menu.
- Select your "Sitemap" page from the left-side panel, click Add to Menu, and drag it to the desired position.
- Click Save Menu. If you are using a Full Site Editing block theme, open the Site Editor, navigate to your footer template, insert a navigation block, and link the word "Sitemap" to your sitemap page URL.
Frequently Asked Questions (FAQ)
Do I still need an XML sitemap if I create an HTML sitemap page in WordPress?
Yes. An XML sitemap is a raw, machine-readable file designed solely for automated search engine indexers to discover all valid URLs. An HTML sitemap page is a designed, human-friendly web page built to improve user navigation and natural internal link flow. To achieve maximum SEO efficiency, you must utilize both.
Will an HTML sitemap page slow down my WordPress website?
If configured correctly, no. Using lightweight methods—such as Rank Math, dedicated simple plugins, Gutenberg core Page List blocks, or custom PHP code—keeps database requests incredibly light. However, if your website has tens of thousands of blog posts and you display all of them on a single page, the server-side query might slow down your page load. In that scenario, use "Compact Archives" settings or group them by year and month.
How do I hide specific pages from my WordPress sitemap?
If you are using an SEO suite like Rank Math or All in One SEO, paste the specific numerical Page IDs of your checkout, cart, or thank-you pages inside the "Exclude Posts" input field. If you are using the manual PHP method, pass the "exclude" attribute containing comma-separated page IDs into the wp_list_pages() function.
Does Google prefer XML sitemaps or HTML sitemaps?
Google does not prefer one over the other because they solve different search challenges. XML sitemaps allow Googlebot to quickly discover and schedule indexing for new, deep-nested pages. HTML sitemaps show Googlebot the exact internal linking relationships, parent-child hierarchies, and relative importance of pages on your domain. Both work hand-in-hand to maximize crawl efficiency.
Can I build a sitemap page in WordPress without using a plugin?
Yes. You can use the Gutenberg editor's native Page List and Query Loop blocks to dynamically query pages and posts. Alternatively, you can write a clean, custom template-sitemap.php file in your WordPress child theme folder and assign it to a dedicated sitemap page.
Conclusion
Learning how to create a sitemap page in wordpress is a high-impact, low-effort optimization strategy that yields immediate results for user retention and search engine visibility. By bridging the gap between automated XML indexers and human-readable layouts, you create a robust ecosystem of internal links that search engines can easily navigate.
Whether you rely on a comprehensive suite like Rank Math, deploy a lightweight utility block, or build a fast custom PHP template from scratch, establishing a visual sitemap directory guarantees that no visitor gets lost on your site, and no page is ever orphaned. Take fifteen minutes to build your sitemap page today, secure it in your global footer, and enjoy enhanced search crawling and simplified navigation for years to come.
