Exploring Wilcity Listing Tabs feature

What can Wilcity Listing Tabs do?  

This Widget will display listings from different sources like directory types or from terms like Listing location, Listing category. It helps viewers approach the listing they want immediately without going to Search V2 page

Main sections of the widget:  

The widget is divided into 6 sections below:

  1. Heading
  2. Post Type Filter
  3. Order By Filter
  4. Navigation Type
  5. Listing
  6. View More results button

1.  Heading: Heading for whole area, type your own title and style it with the color you want. 

2.  Post Types Filter: Viewers can see listing filtered by post types here. 
3.  Order By Filter: Viewers can change the display order of listings with many filters such as “Popular viewed”, “Recommended”, “Random”, “Near by me”, “Discount”, etc.

4.  Navigation Type: It will display categories or locations (read more in part III). So viewers will have more filters to find out their favorite listing. 

5.  Listing: This area will display listings based on all filters of (2) (3) and (4). 

6.  View More button: When there are more results than your theme can show, click here to view more listings.

Settings for Wilcity Listing Tabs widget:  

We will give an example with King Composer Pagebuider (other page builders are similar). The numbers in the pictures below are the same numbers as in part II. That means each number is a section of the Wilcity Listing Tabs widget.  

(1) Heading Setting: Type your title here then choose your favorite color. Please note that the background color of title is the main color of your theme. (You can change it at Theme Options Advanced Setting Theme Color).

(4) Navigation Type

There are 2 sections – Listing Categories and Listing Location. The point is we can put them together

For example, I will choose ONE listing location “New York”, then select some listing categories: “Destinations”, “Hotels”, “Beautiful”, “Ethnic”, “Food & Drink”, “Premium Casual” – we’ve just created a combined filter that displays only listings from New York and viewers will filter more by choosing the category.

Viewers will see:

And vice versa, you can choose ONE listing category then select some listing locations. So that it will display listings from only one category and viewers will choose the location they want.

Besides, there is another setting – Get Term Type – where you choose between 2 options: Specific Terms or Get Child Terms

  • Specific Terms: The terms will be shown at (4) and will depend on what you choose in Navigation Type setting after that.
  • Get Child Terms: Navigation Type will show only child terms of the terms you choose. That means you can choose only ONE parent listing location/category.

(3) Order By Filter: 

There are 4 settings – Order By Options, Default Order By, Order and Maximum items. They will decide how terms are displayed and decide how many listings are shown at (5).

  • Order By Options -> Select options for Order By: Here you select one or as many filters as you want. They will be shown on a dropdown menu. Your viewers will choose one of them to filter their listings. The filters include Random, Near by me, Discount, Open now, Premium listings, etc.
  • Default Order By: You set the default display order of listings that will work before a viewer chooses another filter in Order By.
  • Order: You choose between DESC order or ASC order for listings to be shown in.
  • Maximum Items: You choose the maximum number of listings being shown.

(4) Navigation Type Setting 

  • Is Navigation ?: Enable it if you want to set the order that terms will be displayed.
  • Navigation Order By: Choose the display order for terms among choices like Exactly as you type, Term Name, Term ID, Term Slug, None, etc.
  • Navigation Order: You choose between DESC order or ASC order for terms to be shown in.

(2) Post Types filter 

Use this setting if you want to add one more filter – that is post type filter. It only works when you select at least 2 post types. 

Other settings:  


Let’s take a look at 3 settings – Image Size, Toggle View More, and Tab Alignment 

1.  Image Size: This setting is to change the size of cover image for listing cards displayed at (5).

2.  Toggle View More: If you enable this, a new button “View More” will appear next to Navigation Type. 

The button will redirect to Search V2 page that displays listings

3.  Tab Alignment: This setting will change the position of Navigation Type (4). As default it is right-justified (wil-text-right), but you can change it to center-justified (wil-text-center) if you want.


You will choose the number of columns in one row for each screen size (that are ≥ 1200px, ≥ 960px and ≥ 720px). 

Leave A Comment?