How to Easily Show a Page List with Thumbnails in WordPress (2023 Update)

Want to make your WordPress page lists stand out while improving user experience? Displaying thumbnail images alongside post titles has been shown to boost engagement. This updated guide covers two easy methods to showcase page thumbnails using WordPress plugins or built-in tools.

The Benefits of Adding Thumbnails to Page Lists

Showcasing visual previews of your content via thumbnails provides multiple advantages:

1. Increased Clicks and Visibility

Including thumbnail images makes each list item stand out more, catching reader attention. Studies show posts with images receive 94% more views than text-only posts (Source).

2. Enhanced Understanding of Content

Thumbnails give visitors a peek into what the page is about before clicking. This additional context from images allows users to better scan and understand page content at a glance.

3. Improved Site Engagement

When page lists feel too text-heavy or boring to read, users lose interest quickly. The visual appeal of thumbnails leads to up to 180% higher user engagement compared to plain listings (Source).

4. Faster Content Scanning

Familiar shapes and images are easier for our brains to rapidly process when scanning. Thumbnails can help users efficiently navigate and find relevant pages.

Now let‘s examine two methods to easily integrate thumbnail images into your WordPress page listings.

Method 1: Insert Pages Plugin (Recommended)

For speed and convenience, I recommend using the Insert Pages plugin to generate responsive page lists showcasing thumbnails.

Why Choose Insert Pages?

Insert Pages stands out from other list plugins with its smart defaults and intuitive settings panel:

✔️ Automatically lists all published pages ✔️ Default template shows thumbnail & title
✔️ Additional text and layout options ✔️ Actively updated & supported

Follow these steps to configure:

  1. Install & activate the Insert Pages plugin within your WordPress dashboard
  2. Navigate to Settings > Insert Pages
  3. Select template. The "Thumbnail" template is recommended
  4. Customize display settings like number of pages, order, exclusions, etc.
  5. Copy the [insert_pages] shortcode
  6. Add this shortcode to any page using the editor to display your listing.

For those less technically-inclined, you can also take advantage of the available Insert Pages widgets for even easier setup directly through your widget settings.

Overall, Insert Pages makes including thumbnail page lists a breeze while providing advanced options for customization as your site grows.

Method 2: The WordPress Block Editor

While the plugin route is simplest, you can manually build a page list showcasing thumbnails using the WordPress block editor. Here‘s how step-by-step:

  1. Create a new page or post and switch editor modes to blocks
  2. Add a Columns block
  3. Within the first column, insert an Image block
  4. In the sidebar settings, define the image dimensions suited for a thumbnail (100×100 pixels recommended)
  5. Search for the desired page thumbnail image and upload into this block
  6. Link this Image block to the page URL by highlighting the image and clicking the chain-link icon
  7. Within the second column, add a Heading block for the page title
  8. Insert supporting Paragraph blocks with text or other content as desired
  9. Link the Heading to the related page URL
  10. Duplicate the Columns block to create additional page list items
  11. Populate the Image, Heading, and Paragraph within each column
  12. Continue duplicating until all relevant pages are represented
ProsCons
Fine-tuned control over styling and contentTime-intensive to manually create and update
No coding or plugins requiredNew published pages not automatically added

While taking more effort upfront, the block editor provides greater layout flexibility. However, the Insert Pages plugin remains the easiest and most sustainable solution for most users.

Summarizing the Benefits

Implementing thumbnail images delivers striking visual impact and greater context to improve page list user experience on WordPress sites. Test different placements to determine what works best with your content and visitors.

Hopefully this guide gave you the details and examples needed to decide on the best thumbnail display approach for your unique site. Let me know in the comments if you have any other questions!

We will be happy to hear your thoughts

      Leave a reply

      TechUseful