How To Create A Site Map With Post Images And Descriptions In WordPress

Learn how to create an HTML site map with post images and descriptions for your visitors without touching code in this WordPress ‘quick tips’ tutorial …

How To Create A Site Map With Post Images And Descriptions In WordPress

How To Create A Site Map With Post Images And Descriptions In WordPressSite maps are useful for helping visitors find what they are looking for quickly and easily on your site.

In this WordPress ‘quick tips’ tutorial, we’ll show you a simple and easy way to make your site map more attractive to visitors by including post thumbnail images and descriptions without modifying any code on your site.

In other tutorials, we show you how to create an HTML site map for your visitors and an XML sitemap for search engines.

To learn more about the differences between an HTML site map and an XML sitemap, what they are used for, and how to add them to your WordPress site, see these tutorials:

Most Visitor Site Maps Are Plain And Boring …

Normally, visitor site maps tend to look a little plain or boring, as most consist of a simple list of all the pages and posts on your site …

An HTML site map

(An HTML site map)

As explained in our tutorial on how to add an HTML site map to WordPress, you can easily add a site map for your visitors by installing a plugin (there are many site map plugins to choose from), and then copying and pasting the plugin’s shortcode in the page where you would like your site map to display …

Add a site map shortcode to your Site Map page

(Add a site map shortcode to your Site Map page)

Take Your Visitor Site Map To The Next Level …

Add Post Descriptions To Your Visitor Site Map

Instead of creating a site map for your visitors using a site map plugin, you can add a site map with post descriptions like this …

Add a site map with post descriptions for your visitors

(Add a site map with post descriptions for your visitors)

The above was created using a free plugin called Content Views.

Content Views

Content Views - Post Grid & List for WordPress

(Content Views – Post Grid & List for WordPress)

Content Views is a free WordPress plugin that lets you organize, filter, sort, and display content from selected posts, pages, or custom post types using different views and layouts (e.g. grid, table, list) and insert these views anywhere on your site using a shortcode …

Content Views WordPress plugin

(Content Views WordPress plugin)

The plugin is very easy to use and lets you create unlimited custom views and layouts without touching code.

Tip

‘Content Views’ is a powerful and versatile plugin that can do a whole lot more than just add an attractive site map to your site. For a tutorial that shows you how versatile and useful this plugin is, go here:

Add Images And Post Descriptions To Your Visitor Site Map

The free version of the plugin let’s you add post descriptions but offers limited functionality compared to the premium version (called ContentViews PRO), such as little control over  your post descriptions and no thumbnail images taken from your content.

To have full control of your post descriptions and the ability to display post thumbnail images on your site map, you will need to upgrade to ContentViews PRO

Site map with post images and descriptions

(Site map with post images and descriptions)

To add this enhanced site map to your site, create a “view” (i.e. a layout) that includes all of your posts and copy the shortcode to your clipboard …

Content Views Shortcode

(Content Views Shortcode)

Then paste the views shortcode into your content where you would like the site map to display …

Add the 'content views' shortcode to your Site Map page

(Add the ‘content views’ shortcode to your Site Map page)

Creating a ‘view’ is simple. Here is the process in a nutshell:

After installing the plugin, do the following:

1 – Create a new view and give it a title (e.g. Sitemap).

2 – In the ‘Filter Settings’ tab, select Content Type > Post (note: the premium version of the plugin lets you combine posts, pages, media, and other custom post types).

3 – Make sure that the ‘Include Only’ field is left blank to select all posts published on your site. To exclude posts from displaying on your site map, add the post ids of the posts you would like to exclude into the ‘Exclude’ field.

4 – Leave the ‘Limit’ field blank to display all posts on your site map.

5 – You can sort your list of posts if you like (e.g. alphabetically, by published or modified date, by comment count, etc.)

Content View - Filter Settings

(Content View – Filter Settings)

To configure how the site map will display to visitors, switch to the ‘Display Settings’ tab and change the settings to suit your preferences.

For example, to display a list of posts with one item per row, a  thumbnail image on the left, the post title and the post excerpt, do the following:

6 – In the Layout section, select ‘Grid’ view.

7 – Select 1 item per row.

8 – In the Format section, select ‘Show thumbnail on the left/right of text’ and adjust any other settings to suit (e.g. wrapping text around image), including Thumbnail Position (Left or Right)

9 – Configure your settings for Post Title, Post Thumbnail, and Content.

Content View - Display Settings

(Content View – Display Settings)

Below are screenshots of how the Fields Settings options have been configured for the Thumbnail image, Post Title and Post Description used in our example site map (using ContentViews PRO).

Useful Info

You can change the order of how your post images, post titles and post descriptions display in your views using drag and drop to reposition element layouts.

Post Title

For site map post titles, we just left the default settings (H4 heading) …

Content Views: Fields Settings - Title

(Content Views: Fields Settings – Title)

Post Thumbnail Image

For our example site map, we have configured the following settings:

  • Selected 150×150 thumbnail image size,
  • Enabled ‘Show all images in same size’ checkbox,
  • Added a style to the image (Shadow)
  • Selected to show an ‘Image’ if no featured image found (this automatically grabs an image from your content) …

Content Views: Fields Settings - Thumbnail

(Content Views: Fields Settings – Thumbnail)

Post Description

For the site map used in our example, we have configured the following settings:

  • Selected ‘Show Excerpt’,
  • Limited excerpt to 25 words,
  • Selected ‘Use manual excerpt (without modifying)’. This displays the post excerpt for each entry in the site map (instead of grabbing the first 25 words of each post, which the free version of the plugin does).
  • Enabled the ‘Read More…’ text to display for each entry (the premium version of the plugin lets you customize this section, including text, typefaces, button colors, etc.) …

Content Views: Fields Settings - Content

(Content Views: Fields Settings – Content)

As you can see, we have gone from adding a plain looking site map for your visitors like this …

Visitor site map created using a site map plugin

(Visitor site map created using a site map plugin)

To adding a site map with post descriptions like this …

Visitor site map created using Content Views plugin

(Visitor site map created using Content Views plugin)

To adding a site map with an attractive layout for visitors that includes post thumbnail images and customized post excerpts like this …

Visitor site map created using ContentViews PRO plugin

(Visitor site map created using ContentViews PRO plugin)

We hope that you have found this ‘quick tips’ tutorial on how to create a visitor site map with post images and descriptions in WordPress useful.

Tip

For loads of useful WordPress tips, sign up to our FREE 101+ WordPress Tips, Tricks & Hacks For Non-Techies e-course!

How To Create A Site Map With Post Images And Descriptions In WordPress

(Source: AustralianPrints.com)

***

"Your training is the best in the world! It is simple, yet detailed, direct, understandable, memorable, and complete." Andrea Adams, FinancialJourney.org

***

Using Post Categories To Improve WordPress SEO, User Navigation & Content Layout

Learn how to improve SEO, user navigation, and the content layout of your website or blog using post categories …

Using Post Categories To Improve WordPress SEO, User Navigation & Content Layout

WordPress post categories help keep your website and your content organized, boost your search engine rankings, and make it easier for site visitors to find what they are looking for.

WordPress post categories can also be used to improve your content layout.

In this tutorial, we’ll look at ways to improve SEO, user navigation, and the content layout of your website or blog using post categories.

Info

For a detailed step-by-step tutorial on WordPress post categories and how to set up and use categories in your posts, see the tutorial below:

Improve WordPress SEO, User Navigation & Content Layout With Post Categories

Categories are normally assigned to WordPress Posts, not Pages , so we’ll focus on posts in this tutorial (if you are unsure about the difference between posts and pages, see our tutorial on WordPress Posts Vs WordPress Pages).

Tip

If you need to add categories (and tags) to your WordPress pages, you can install a plugin like Post Tags and Categories For Pages.

Planning Your Categories

Even though WordPress is flexible enough to let you add new categories ‘on the fly,’ if you don’t plan your categories (and subcategories) properly, you will find it harder to keep your site organized and manageable as more content gets added to your site.

If you need help planning your website, your content, or your categories, see our website planning tutorials and our guide on keeping your website manageable and organized.

Improving WordPress SEO With Post Categories

The simplest and easiest way to improve WordPress SEO with post categories is to:

  1. Set up permalinks to include categories, and
  2. Install and configure an SEO plugin like Yoast SEO

Include Categories In Your Permalinks

Permalinks are a feature of WordPress that lets you set up search-engine friendly URLS (for more details, see our tutorial on how to set up and use WordPress permalinks).

When configuring your permalinks, all you need to do is make sure that post categories are included in the URLs …

Include categories in your permalinks

(Include categories in your permalinks)

This will automatically display search-engine friendly URLs with your categories (and subcategories) and post title keywords …

Search-engine friendly URLs with categories and subcategories included

(Search-engine friendly URLs with categories and subcategories included)

Use An SEO Plugin

Installing an SEO plugin like Yoast SEO will not only improve the SEO of your content, it also lets you optimize your post categories, category archive pages, etc. …

Optimize your post categories with an SEO plugin

(Optimize your post categories with an SEO plugin)

Adding category descriptions will display on some WordPress themes and can help to boost your content’s SEO …

Category descriptions can help boost your content's SEO

(Category descriptions can help boost your content’s SEO)

Once your permalinks and SEO plugin settings are configured for your post categories, WordPress will then automatically start delivering you the SEO benefits of search engine-friendly URLs and better content indexing.

Improving User Navigation With Post Categories

Post categories can be used to improve user navigation on your WordPress site in different pages and different sections of your site, on site maps, menus, sidebar widgets, archive pages, even different RSS feeds.

Here, for example, are some of the ways you can help users navigate your content using post categories …

Categories Widget

Adding a categories widget to your sidebar lets users find related content assigned to a category …

Add a categories widget to your sidebar

(Add a categories widget to your sidebar)

When users click on a category link on the categories widget, they are taken to a category archive page.

Category Archive Pages

Category archive pages group together all posts assigned to a category …

Category archive page

(Category archive page)

Breadcrumb Navigation Links

Breadcrumb navigation links display on some WordPress themes.  Displaying categories in breadcrumb navigation links not only helps to improve user navigation, but also SEO …

(Display categories in breadcrumb navigation links)

Clicking on the category section of the breadcrumb link will take users to the category archive page.

Info

If you use the Yoast SEO plugin and your WordPress theme does not support breadcrumb navigation links by default, you (or your website developer) will either need to edit your theme’s templates and add a snippet of code to display breadcrumbs, or choose a WordPress theme that supports features like breadcrumb navigation links (e.g. the Avada theme) …

Themes like Avada support breadcrumbs

(Themes like Avada support breadcrumbs)

Improving WordPress Content Layout With Post Categories

Post categories and subcategories can be used to help organize and improve the layout of your content.

For example, WPCompendium.org’s WordPress tutorials are organized into the main categories below:

If you click any of the above links, you will see pages displaying a list of tutorials for each category organized in a grid view layout …

List of posts grouped by category

(List of posts grouped by category)

Some sections, like our WordPress Plugin Tutorials, display a list of post sections grouped by subcategories …

List of post sections grouped by subcategory

(List of post sections grouped by subcategory)

Clicking on an item in the ‘WordPress Plugin Tutorials’ page will take you to a page displaying all the tutorials grouped under one of its subcategories, such as:

We use post categories and subcategories to organize, filter, and display content on WP Compendium’s tutorial sections using a premium plugin called Content Views Pro.

The plugin also has a free version, called Content Views.

Content Views

Content Views - Post Grid & List for WordPress

(Content Views – Post Grid & List for WordPress)

Content Views is a free WordPress plugin that lets you organize, filter, sort, and display content from selected posts, pages, or custom post types using different views and layouts (e.g. grid, table, list) and insert these views anywhere on your site using a shortcode …

Use categories to display posts using different layouts

(Use categories to display posts using different layouts)

The plugin is very easy to use and lets you create unlimited custom views and layouts without touching code.

The free version of the plugin provides 3 basic layouts (Grid, Collapsible list, Scrollable list). The comprehensive premium version (Content Views Pro) provides the basic layouts and a whole lot more, including many advanced features  …

Display your content using different views and layouts with the Content Views Pro plugin

(Display your content using different views and layouts with the Content Views Pro plugin)

Although this tutorial focuses mostly on post categories, with Content Views Pro installed, you can create different views using posts, pages, and custom post types and filter these using a combination of different criteria including post categories, tags, publish date, post author, keywords, and custom fields.

You can also sort and organize your content using a wide range of methods, including post or page IDs, published date, modified date, drag & drop, post slug, comment count, menu order, custom fields, and even random sort (content displays in random order every time the page is refreshed) …

Create customized views to display content on your WordPress site

(Create customized views to display content on your WordPress site)

Views are created by selecting different options in the view-building form …

Create different content views by selecting options

(Create different content views by selecting options)

You can live preview your content as you build or edit your views …

Preview as you build

(Preview as you build)

After creating and saving your views, the plugin generates a shortcode which you can use to insert into your posts, pages, widgets, etc. …

Use shortcodes to insert views into your content

(Use shortcodes to insert views into your content)

The Content Views or Content Views PRO plugin gives you complete control over how your content is grouped and displayed to visitors. Views are 100% mobile responsive and the plugin is optimized to help improve SEO.

Tip

You can also use the Content Views plugin to add an attractive site map for your visitors with post thumbnail images and descriptions. To learn more, go here:

For more details about using the plugin, check out the video below, visit the FREE version plugin page here, or check out the Content Views Pro website for a full list of features, comprehensive demo site, plugin pricing and FAQ section, and more.

(Overview of WordPress Content Views)

We hope that you have found the above information useful. Feel free to check out the tutorials on the demo view below …

Webinar JEO - Webinar Software

Grow Your Business Online With Webinars

Learn how to grow your business online with webinars and a professional webinar software that lets you run unlimited webinars for unlimited attendees ...
NoteTab - Text And HTML Editor

NoteTab – Text And HTML Editor

NoteTab is a powerful text and HTML editor tool that lets you edit multiple text files simultaneously, strip HTML from code and a whole lot more ...
TreePad Plus

TreePad Plus – Content Planning And Organization Tool

Use TreePad PLUS to store all of your notes, letters, images, emails, texts, hyperlinks, passwords, code snippets, etc. and to keep all of your information easily and readily accessible, organized, and searchable ...
RoboForm - Password Management Tool

RoboForm – Password Management Tool

RoboForm is a powerful password management tool that lets you easily store all of your login passwords and generate secure passwords ...
How To Research Keywords For SEO Content

How To Research Keywords For SEO Content

Learn how to do effective keyword research and improve your content SEO in this step-by-step tutorial ...
Loading...

***

"Your training is the best in the world! It is simple, yet detailed, direct, understandable, memorable, and complete." Andrea Adams, FinancialJourney.org

***

Avada – A Highly Customizable Multipurpose WordPress Theme

Avada is a fully responsive and highly customizable WordPress theme that offers you unlimited flexibility and lets you build any kind of website you need for any type of business without having to touch code ….

Avada – A Highly Customizable Multipurpose WordPress Theme

If you are looking for a fully responsive and highly customizable WordPress theme that offers you unlimited flexibility and lets you build any kind of website you need for any type of business without having to touch code, then you would be hard pressed to find a better theme than Avada.

Avada

Avada WordPress Theme

(Avada WordPress Theme)

Avada is one of the best-selling WordPress themes of all time. It installs with over 40 pre-made fully-featured websites and over 255 pre-made web page designs …

Avada installs with 40+ pre-made websites and 255+ web page designs

(Avada installs with 40+ pre-made websites and 255+ web page designs)

Avada integrates with WooCommerce and comes with a number of store demos allowing you to easily set up an online store and sell your products …

Avada integrates easily with WooCoomerce

(Avada integrates easily with WooCoomerce)

With Avada, you literally can build anything online, from websites for micro-businesses and small businesses, to corporate websites and blogs, portfolio websites, e-commerce stores, and more!

The Avada WordPress theme lets you build anything online!

(The Avada WordPress theme lets you build anything online!)

This premium theme is used by hundreds of thousands of websites and sells for around $60.

Check out the Avada demo.

Avada Theme Options

The Avada theme is easy to install, configure, and use.

Once installed, Avada adds its own menu section in the WordPress admin menu, giving you access to guided tours, support, documentation, system status, additional plugins and theme options …

Avada menu section

(Avada menu section)

Avada offers an incredible amount of flexibility allowing you to build a unique-looking website. The Theme Options menu provides thousands of highly configurable options neatly organized into sections that allow you to build and customize your website without any coding knowledge …

Avada theme options menu

(Avada theme options menu)

The image gallery below contains screenshots of the Theme Options menu …

(Avada Theme Options – Settings)

Avada also includes plugins like Fusion Builder that lets you create unique pages using drag and drop …

Avada lets you build unique web pages using drag and drop

(Avada lets you build unique web pages using drag and drop)

Fusion Builder provides you with a huge library of functionality (called ‘elements’) that you can add to your pages …

Fusion Builder elements

(Fusion Builder elements)

Avada Theme Support

The Avada theme developers provide excellent customer support and regular theme updates …

Avada theme is regularly updated

(Avada theme is regularly updated)

The Avada theme comes with 6 months of free technical support (extended through an annual subscription), plus access to documentation, product knowledgebase, video tutorials, community forum, and Facebook group …

Avada theme developers provide great customer support

(Avada theme developers provide great customer support)

Avada Theme – Additional Info

In addition to all the configurable options, plugins, templates, and design elements included with the theme, Avada is:

  • Fully Responsive: Your website will adapt and look great on every device, web browser, and screen size.
  • Translation & RTL-ready: You can translate your site into any language, or use one of dozens of included language files. Avada is also fully RTL (right-to-left) compatible.
  • Layout: Control the overall site width, main content area, and single and dual sidebar widths using pixels or percentages. Choose full-page or boxed layouts for different pages, advanced header and footer options, multiple menu locations, 1-6 column options, mega menus with widgets, page title bars, different types of sliders, lightboxes, custom backgrounds, one page sites with parallax scrolling effects, multi-page sites, etc.
  • Blog: You can run a website or e-commerce store as your main website and a blog with a different layout and customizable blog options. You can also add a forum, portfolio pages, etc.
  • Unlimited Colors: Avada provides unlimited color choices and options for your website and page elements using an advanced color selection tool.
  • Advanced Typography: Avada offers advanced typography options that give you full control over the type that displays on your website.
  • Social Sharing: Avada has a full set of social icons and styling options for sharing your content.
  • SEO and Speed Optimized – The theme is optimized for search engine indexing and a great user experience.

Watch the video below for a guided tour of the Avada theme …

(Avada WordPress Theme – video tour)

In short, no matter what business you are in or what kind of website you plan to build, with a theme like Avada installed on your WordPress site, you can easily build and configure a unique website that lets you do whatever you need, that puts you in control of your digital presence, and that will save you hundreds or even thousands of dollars on the cost of web development or web design.

For more details about this excellent WordPress theme, or to view demo options, review customer testimonials, etc. go here: Avada Theme

***

"These tutorials have so much information and are easy to understand. If you use WordPress or plan to in the future these will help you with everything you need to know." - Valisa (Mesa, Arizona)

***