Recently I received another interesting question from one of my clients. She was looking for a simple method of creating a visual sitemap on her Wordpress website.

Needless to say, there is a solution ...

But let's start with the basics ... It's a well-known fact: when it comes to SEO and search engine visibility, sitemaps are essential components ... And there are three types of sitemaps namely XML, HTML, and Visual sitemaps. Obviously, each type has its own purpose ...

The "regular" XML sitemap is created for search engines. It uses the XML markup language to represent the structure and the contents of your website. The search engines and the crawling bots can read the XML sitemap in order to prioritize and adjust the crawling rate for your site. They are essential for your SEO efforts because they make it easier for Google (and other search engines) to find your site's pages ...

On the other hand, the HTML sitemap will be used by your readers ... Basically, an HTML sitemap is an organized, well-structured list of all your pages. It's like an actual map that will help your users to easily and efficiently navigate your site ... through clickable hyperlinks. Here's an example:

Needless to say, having an HTML sitemap is always a good idea ... After all, we are creating content for humans and not for search engines! Our primary goal is to make our site accessible for our visitors and we need to use different ways and methods to make our site "operable" and more user-friendly ...

If you want, you can easily create a simple HTML sitemap following my tutorial:

Why and how to create an HTML sitemap page in Wordpress without coding

But here's the thing ... While the HTML sitemap is great to display your site’s content structure, sometimes it isn’t the ideal option ... Sometimes you'll want to display the clean hierarchical layout of your different pages and sections, and this is where a visual sitemap comes in handy. A visual sitemap will allow you to display levels, items, child-items, and sibling-items in a tree-like structure. Here's an example:

And it's incredibly easy to create a nice visual sitemap in Wordpress ... So I've decided to create this short tutorial to show you how easy it is ...


Let's do this!

Join the Discussion
Write something…
Recent messages
BlueJasmin Premium
This is awesome! Thank you.

I will read it a few times again and again and will follow your steps.

Thank you very much.
smartketeer Premium
Thanks for stopping by Nella!
RosanaHart Premium Plus
I just added this free plugin to my author site and I really like it.

I did tweak my menus to get it just how I wanted. I had seven categories across the top menu, and that made the boxes too narrow on the visual sitemap. So I put my press kit under my homepage and I moved my sitemap link to the other menu, the one that has about, contact, earning disclosure, privacy policy.

Here's a screen shot.
smartketeer Premium
Nicely done Rosana!
dowj01 Premium
Very useful, a great way to display your sitemap. Thank you for the tutorial.
smartketeer Premium
Thank YOU!
DPendergrass Premium
thanks for the training
smartketeer Premium
Thanks for the time!
AlanJE Premium Plus
Fantastic training, thanks for sharing, Zed, Alan.
smartketeer Premium
Once again, thanks for the time Alan!