WPRentals Theme Documentation WPRentals Theme Documentation

  • Client Support
  • Video Tutorials
  • WPRentals
  • WPEstate
  • API
Home / Elementor WPRentals Studio, Shortcodes / How to use the WPRentals Grids widget for Elementor

How to use the WPRentals Grids widget for Elementor

5970 views
In this video, you will learn how to use the WPRentals Grids widget to create a section where listing categories are displayed. Watch Video on Youtube

Overview

The WPRentals Grids widget for Elementor lets you display listing taxonomies in a grid layout.

You can use this widget to show items such as cities, areas, property types, or property categories on pages created with Elementor.

This is useful when you want visitors to browse listings by location, type, category, or area from a visual section on your website.

Important: The WPRentals Grids widget displays taxonomy terms, such as cities, areas, types, or categories. It does not display individual listings. If you want to display listings, use a listing widget or listing shortcode instead.

CONTENT

  • Before you start
  • Edit the page with Elementor
  • Add the WPRentals Grids widget
  • Choose which taxonomy items to show
  • Grid settings explained
  • Style the grid
  • How to add images to categories
  • Image tips for grid items
  • Troubleshooting
  • Important notes
  • Related help

Before You Start

Before using the WPRentals Grids widget, check the following:

  • The page is edited with Elementor.
  • The WPRentals Elementor Widgets plugin is installed and activated.
  • The categories, cities, areas, or property types you want to display already exist.
  • If you want images to show in the grid, each taxonomy item must have a featured image added.
Important: Use one editor for the page. If the page is created with Elementor, continue editing it with Elementor. Do not edit the same page with WPBakery or Gutenberg.

Edit the Page with Elementor

Go to the page where you want to add the grid, for example your homepage or a landing page.

  1. Go to Pages.
  2. Edit the page where you want to add the grid.
  3. Click Edit with Elementor.
  4. Choose the section where the grid should appear, or create a new section.

Add the WPRentals Grids Widget

In the Elementor sidebar, search for:

Grids

Find the WPRentals Grids widget and drag it into the section where you want the grid to appear.

Choose Which Taxonomy Items to Show

After adding the widget, open the widget Content settings.

From this section, select which taxonomy type you want to display in the grid.

You can display items such as:

  • Cities
  • Areas
  • Property Types
  • Property Categories

You can choose to show all items from the selected taxonomy or manually select only specific items.

Grid Settings Explained

The widget includes several options that control what appears in the grid and how the grid is organized.

Taxonomy Type

This option controls what type of items the widget displays.

For example, you can display cities, areas, listing types, or listing categories.

Show All or Select Specific Items

Use this option to decide if the widget should display all items from the selected taxonomy or only selected items.

  • Use all items when you want the widget to automatically show everything from that taxonomy.
  • Use selected items when you want to manually control which categories, cities, areas, or types appear in the grid.

Grid Layout & Design Style

There 2 options control the layout style used for the grid items.

From Grid Type, choose the layout that best matches your page design.

From Design Type, choose between different styles can change how the image, title, count, and overlay appear.

Number of Items

This option controls how many taxonomy items are displayed in the grid.

Hide Empty Categories

This option controls whether taxonomy items with no listings are shown.

  • Set this option to Yes if you want to hide categories, cities, areas, or types that do not have listings.
  • Set this option to No if you want to show them even when they do not have listings yet.

Order Options

This option controls how the taxonomy items are sorted.

For example, you can order items by name or by listing count, depending on the widget options available in your theme version.

Style the Grid

Open the widget Style settings to customize the grid design.

Depending on the widget options, you can manage:

  • The height of each grid item
  • Border radius for rounded corners
  • Spacing between columns and rows
  • Text color
  • Typography
  • Overlay color
  • Title position
  • Category count style

How to Add Images to Categories

The image shown in the WPRentals Grids widget comes from the taxonomy item image.

For example, if the widget displays cities, the image must be added to the city term. If the widget displays property categories, the image must be added to the category term.

Step 1: Go to the Taxonomy Section

In the WordPress dashboard, go to:

Listings, Bookings & More

Then open the taxonomy you want to edit, such as:

  • Categories
  • Types
  • Cities
  • Areas

Step 2: Edit or Add a Taxonomy Item

To add an image to an existing item, hover over the item name and click Edit.

To create a new item, add the name in the form and click the button to add the new taxonomy item.

Tip: You can let WordPress create the slug automatically. If you edit an existing taxonomy item, avoid changing the slug unless you also want to change the URL for that taxonomy page.

Step 3: Set the Featured Image

In the taxonomy edit screen, find the option to upload or set the Featured Image.

  1. Click Upload/Add Image.
  2. Choose an existing image from the Media Library or upload a new image.
  3. Save the taxonomy item by clicking Update.

Image Tips for Grid Items

  • Use images with a similar size and orientation for a cleaner grid design.
  • Use large enough images so they do not look blurry on desktop screens.
  • Use images that match the taxonomy item. For example, use a city image for a city term.
  • If a grid item shows without an image, check that the taxonomy item has a featured image saved.
  • After changing taxonomy images, clear cache and refresh the page.

Troubleshooting

The widget does not appear in Elementor

  • Make sure the WPRentals Elementor Widgets plugin is installed and activated.
  • Make sure Elementor is installed and active.
  • Update WPRentals theme and WPRentals plugins to compatible versions.

The grid does not show the expected categories

  • Check that the correct taxonomy type is selected in the widget.
  • Check if the widget is set to show all items or only selected items.
  • If Hide Empty Categories is enabled, taxonomy items without listings will not show.
  • Check that the listings are assigned to the correct categories, cities, areas, or types.

The category image does not show

  • Edit the taxonomy item and check that a featured image is saved.
  • Check if the image still exists in the Media Library.
  • Clear cache and reload the page.

The grid layout does not look correct

  • Check the widget layout and style settings.
  • Check Elementor section or container width.
  • Adjust item height, spacing, and image sizes.
  • Test the page on desktop, tablet, and mobile.

Important Notes

  • The WPRentals Grids widget is an Elementor widget.
  • The widget displays taxonomy items, not individual listings.
  • The widget can display cities, areas, property types, or property categories.
  • The displayed image comes from the taxonomy item featured image.
  • If Hide Empty Categories is enabled, empty taxonomy items will not show in the grid.
  • If a taxonomy item has no featured image, the grid item may show without the expected image.
  • The grid design is controlled from the Elementor widget settings.
  • After changing images, widget settings, or taxonomy details, clear cache and test the page again.

Related Help

  • How to Use the WPRentals Grids Widget for Elementor
  • How to Work With the WPRentals Elementor Widgets Plugin and Import Pre-built Elementor Templates
  • Property Taxonomies: Category, Types, City and Area
Elementor WPRentals StudioShortcodes

Related Articles

  • How to manage the Call to Action Widget for Elementor
  • WPRentals Studio and Elementor Free
  • How to create a custom Contact page using the WPRentals Contact form builder for Elementor
  • How to Manage the WPRentals Map with Listings Widget

HELP CATEGORIES

  • 61. General
  • 72. Installation & Basic Setup
  • 373. How Booking Works
  • 18Advanced Search
  • 17Elementor WPRentals Studio
  • 14Email Notifications
  • 27FAQ
  • 14Installation FAQ
  • 10Menu Options
  • 33Owner & Renter
  • 8Page Templates
  • 24Property / Listing
  • 22Shortcodes
  • 4Supported Maps
  • 99Technical how to
  • 5Third Party plugins
  • 4Translation & Multi Languages
  • 3WordPress Blog Post
  • 13WordPress Widgets
  • 12WP Rentals Payments
  • 80WP Rentals Theme Options
  • 26WPML & Weglot

Join Us On

Powered by WP Estate - All Rights Reserved
  • Client Support
  • Video Tutorials
  • WPRentals
  • WPEstate
  • API