How to add a Visual Sitemap for WordPress

Hello friends,

Do you want to create more engagement with your posts and pages in WordPress? I suppose you do, as this is very important for SEO and for conversions.

In this post I will show you how to achieve this by adding a Visual HTML Sitemap for your website!

But before we begin, let me remind you the importance of having a standard HTML sitemap in the first place and how to add one to WordPress.

In the post “Add powerful XML and HTML sitemaps to WordPress” I have showed you one awesome way to generate a simple, yet powerful and great-looking HTML sitemap. You just had to use the plugin WP Sitemap Page. When done with the settings you had to select a specific shortcode and place it on one of your pages and voilà – the HTML sitemap was generated and made available for your visitors and the search bots.

In that post I have put the focus on the additional navigation that is provided by any HTML sitemap. Your visitors will always be able to see the detailed structure of your website and to visit any specific page or post that they might find interesting. In order this to happen you need to make the page with the HTML sitemap public and also to build as many internal links to it as possible. The smart way to achieve this is by adding this page to your WordPress menus. As you know many themes support different menu areas, so make sure that you are utilizing them correctly. Always create a menu with the thought of improving the user experience when browsing your website!

A standard HTML sitemap is also suitable for the crawling bots. Why? Because they will visit the page that contain its content and then they will visit all the links that are there. Well, at least if you haven’t decided to add a “nofollow” attribute to each link (this is supported by WP Sitemap Page).  Or if you haven’t added a general nofollow instruction for the robots for this page (either by using a SEO plugin or by adding code to your Robots.txt file).

If you haven’t done any of these then the bots will crawl your HTML sitemap and therefore will visit all pages and posts that you have decided to include in it. The HTML sitemap will also ensure the creation of additional internal links which is also very important for SEO and will help you for the fight for higher positions in the search results.

OK, but what is the difference between the standard HTML Sitemap and the Visual one?

The standard HTML Sitemap, no matter how useful it is, is boring! Why? Because in most cases it provides only a pile of links.

The Visual HTML Sitemap on the other hand looks stunning. It gives a better view of the website structure. In the mean time this is still a HTML Sitemap, meaning that all of the benefits that the standard one provides will be included as well.

How to add a Visual HTML Sitemap for my WordPress webiste?

Install and activate the plugin Slick Sitemap. You can do this by using either the WordPress plugin installer or by manually upload the plugin. Then you need to head to Settings -> Slick Sitemap in your WordPress dashboard. Select the default sitemap menu that will tell the plugin what is the website structure and then set the default columns and the default utility menu.

You may have figured it out that if you want to include all of your posts, pages, custom post types, etc you need to add all of them to a new menu. So unless you are satisfied with the current menus that you have already created, you need to go to Appearance -> Menus and add a new one. Choose its contents, and hierarchy and provide it with a suitable name so that it will be easier to find it when adjusting the settings for Slick Sitemap.

Now that you are done with this you need to save these settings (Settings -> Slick Sitemap). Then create a new page and place the shortcode slick-sitemap (in []) and publish it. After this add this page to your default menus so that it will be easily accessed by both visitors and crawling bots and that’s it! Your Visual HTML Sitemap is created!

But what if I don’t want to have a publicly available Visual HTML Sitemap?

There are different reasons why you’d need only a standard HTML Sitemap that should be available to everyone and the Visual one (if you need it at all) to be visible for select audiences only.

The main reason for such decision is that the colour scheme of the Visual Sitemap does not fit on your WordPress theme. Also the client for whom you are creating a website might not like it. However I strongly advice you to have a Visual HTML Sitemap even if it’s meant to be shown to specific people.

One way to achieve this is by using the WordPress page settings for the page that holds the contents of the Visual Sitemap. You need to make it no-indexable and no-followable and also you need to choose between access with password or make the page private.

The next way is more suitable for showcasing the website structure to your clients. It is achieved by using the plugin Visual Sitemap.

Install and activate it in the already known ways and when you are done you can head to the newly created “Sitemap” menu in your WordPress dashboard. Your Visual Sitemap will await you there and anyone with access to the admin panel will be able to see it.

So these are the top solutions for creating a Visual HTML Sitemap for your WordPress website. What do you think of them, friends?

About Daniel Angelov

AvatarHi! My name is Daniel Angelov and I am a guest-author at TheCMSPlace. I am a certified SEO and Digital Marketing Specialist. My passion is WordPress, Social Media, Project Management, Open Source Software, Marketing, SEO and Copywriting. In my free time I like reading and fishing. My personal blog is ""

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.