How do you create the Directory website using WordPress (Full guide)

Jun 30, 2022
The Ultimate Step-By-Step Guide to Creating a Directory Website on WordPress

You might have heard of some of the most well-known directories. eBay, Yahoo, Facebook, Bing, Foursquare, and Yelp are just some of the websites that provide details about the various products and services that are available for our eyes. A simple method to create directories sites to list almost anything. It is possible to find numerous instances of residential real estate, local business, and even cars. It doesn't matter what there is a way to include it.

What is a directory site?

Directory sites are website that showcases products and services you can browse through. For the purpose of creating one, you need to use WordPress:

  1. Choose a niche
  2. Find a way to make money from your work
  3. Make sure you are conscious of your brand's image
  4. Create your directory's site
  5. Use the main features to help

But as with any complex project, it's essential to be sure to follow the right path in order for a successful one. In this blog we'll walk you through the essential steps you must follow to create the perfect directory site:

Selecting a niche to use for Your Directory Website

If you've made the decision to build such a site, the first thing to consider is:

What do you plan to include in your directories?

These are the steps you must take in order to evaluate the area your directory can be a specialist in.

Imagine what you'd be interested in selling:

It is essential to determine what types of products as well as industries and services you're looking for. If you start by thinking about this prior to the time, it's simpler to be more excited regarding the task, and it'll hopefully come more easily to identify at least about four to five different businesses, niches, or verticals you could utilize as the basis to continue your research.

For instance If you love dining out and enjoying dinner with your friends You'll be able to get an idea of the top eateries in your city or town as well as the types of meals they serveand their most well-known dishes.

This gives you the accurate information you could use to begin with specific places to eat, which you have a good idea of good rather than spending your time at other locations.

Check out what people are searching for to find:

It's exactly what I'm discussing. Imagine you've considered developing an online directory that allows users to find local builders. I've employed Ahrefs to discover the keywords that are used frequently (above 200 times each month) and that aren't too highly competitive (a difficult rating for terms with a score below 50). Below is a list:

Ahrefs result page for a given query
Ahrefs result page for a given query
  • Builders near me
  • Fence builders have been within my area.
  • Home builders from my neighborhood
  • Homes for builders within the vicinity of me
  • Custom built home builders
  • Builders to build homes
  • Garage builders
  • The builders of the Christmas season
  • Builders of pools near me

You'll know which keywords to focus on in order to make your website rank higher. There's more, however by conducting this study and analysis, you'll determine the types of builders that are searched for by users. For instance, you could use the search phrase "pool builders close to my location" is one of the most popular searches which you may want to include a complete section on your directory site.

Find out if there are any websites that are already catering to your specific niche.

The top list of lengthy-tail keywords is an aspect. But, it will be less useful should there be directory sites offering them. Search engine optimization tools allow you to know the top performers for these searches. You can also determine how well-known each keyword is. If you don't have a lot of competition, then you've found the ideal market.

As per the builders directory , as an example. These are websites that rank highly on Google search results for "fence building."

Serp overview for directory website
Ahrefs serp overview

It is evident that there aren't many builders' directory sites. Furthermore, those that do show up in the top 10 don't possess a dazzling Ahrefs score, meaning we should be able to outdo these sites if we're careful in regards to SEO.

Search for businesses who will Be able to Use Your Directory Website:

When you've realized that there is a demand for your particular niche You should reach out to companies to see if they will be happy to spend money to use your service. In this case, you're creating an online directory of real estate located in New York, will real firms interested in real estate take advantage of your website to advertise their houses?

There will be a need to get in touch with them later on once your directory website is running smoothly, however it's always a good idea for to be on your radar to ensure that they know the person you were when you come back to them.


How to Make Money With Your Directory Website

Two methods to earn money through your directory site in a only a couple of minutes

1. Pricing for Listings

The moment you do this is the time to charge for that privilege. It is possible to offer premium listings which rank in the top positions of search outcomes (similar with Google results) that will not expire.

You can either set up an annual fee for users who frequently post their material or pay one-time charges for those not anticipating submitting large quantities of material.

2. Sell Advertising Space

With the (hopefully) large number of visitors to your site, you'll be able to grow your earnings get by offering relevant ads.

3. Subscription or Membership-Based Website

If your directory website is well-known as a source of information in the field that you're looking for it will be possible for both users and listers to have access to your data.

Listers want access to the large amount of prospective customers who visit your website. So, they'll offer features like listings with dates of expiry, or listings in the initial page results.

Similarly, customers may want to pay for the privilege to view the best deals on your site. It is also possible to let customers browse the entire catalog, but only provide access to contact details to those who are subscribed member.

Branding

Before you dive into actually designing your website, it's crucial to establish the plan for branding.

Your goal is to appeal to two kinds of customers who are looking for listings as well as those who are looking to market listings. Thus, it's important think about how you can draw in both types of users.

Branding is the most important aspect of every brand. It must comprise:

Setup Your Directory Website

Before creating features and adding contents to your directory website There are four main components you'll require to put in place.

1. Picking the right platform for your website

There are several reasons choosing WordPress.org is an excellent alternative for directory sites.

  • Many of the well-known websites, such as CNN make use of WordPress
  • Due to its popularity, you are able to benefit from the biggest Open Source communities of developers editors, designers, and content creators.
  • WordPress offers hundreds of plug-ins and themes which allow you to personalize your directory website
  • There are many methods to integrate complex functions using no PHP code (we'll go over the specifics in a moment)

2. Pick a Reliable Web Host

Since you're operating your own directory website that is attempting to make money and witness a steady rise in traffic, you'll require a reliable website host for your security.

Web hosting is a real house that websites point to. In this "house," your web host will hold all of the website's data.

When you choose a host for your directory site, you'll want a choice which can handle the peaks of traffic, enhance your site's performance and also has an established track record of reliability in the event of outages.

My dashboard
My dashboard
  • Customer service is available 24 hours a day, with an average reply time of less than 5 minutes.
  • More speedy page load times
 load time comparison
Comparative load time comparison

3. Customize Your Website's Look by choosing a stunning theme

When you've got the WordPress website running You must decide the way it should appear. The first thing to do is choose your theme.

  • What is the frequency at which the theme is kept up to date?
  • Are you sure it is multi-lingual?
  • Can it make you appear on the first page on Google search results?
  • Do you think it will work with plugins?
WordPress plugins directory website
WordPress plugins directory homepage

4. Choose the plugin you'd like for building Your Directory Website

An online search for directory plugins is sure to provide a variety of options. But which one is best? Whatever plugin you select should be able to assist you create the features you will need quickly and efficiently to make your site shine.

I made use of Toolset Directory to build the directory for my website for old vehicles that I'll utilize as an example for the remainder of the post. I decided to use Astra as the theme.

Example of a directory website built on WordPress
An example of a directory site created with the help of WordPress

I chose to utilize Toolset due to:

  • It provides all of the features that I want to create a directory, without using additional plugins
  • It's not required to make use of PHP to include these features.
  • It can be used in conjunction with other plugins such as WooCommerce, Elementor, and WPML
  • It is a great method to tackle the most important themes.

Before we start going through the various options, ensure to follow the directions in installing the Toolset plugins as well as creating the directory web site.

In the design phase, we are defining features to be used on a Directory Website

The following is a listing of features that I'll look at that I created for my previous cars directory website:

  • Custom-designed post types
  • Custom fields
  • Custom taxonomies
  • One way to show off your various items (classic automobiles in our example)
  • Look for individuals to peruse our cars
  • The front-end form lets customers to add their listing

There are many different options that you could add to your directory site, but according to the opinion of others I've spoken with I believe these are the most effective ones for getting your site working.

Let's get started!

Design and create custom Post Types

Custom post types let you design different sections on your website. WordPress comes with two default sections, pages and posts. Naturally, we will require a section for classic vehicles that will be added soon.

I created a new post type called Listings this is where I showcase all my classic cars.

Custom post types in Toolset
Custom post types are available within Toolset

1. If you're currently on your WordPress Administrator page go through the Toolset page and then click to add a new type of post.

2. Include the following information in the Name and Description section:

Adding new post type in WorPress Toolset settings
New post types added to Toolset

3. Select the Save Post Type option and the type of post is now available.

Design Fields that include Custom Fields

Custom fields are used to preserve all of the details about our listings. For our example of classic cars, we'd like to supply our customers with all information they would like to know about each one of them.

It is important to know the production year, cost and the model, mileage and lots of other details. For the purpose of filling each piece of information it's necessary to create the field unique. Therefore, we'll only need to fill in each line is when we edit our listing and it will appear up at the top on the screen (once you've made your template that's what we'll do in the near future).

These are the steps for making a customized field The year of production:

Are you interested in knowing how we increased our visitors by 1000%?

Join the 20,000+ who receive our newsletter every week with insider WordPress tips!

Production year as an example of custom field in Toolset
Year of manufacture provides an illustration of custom field within Toolset

1. In the Toolset dashboard click on Create Field Group in the middle of your Listings custom post type.

2. The following page should give a name to the field you are in and provide a description if you feel it's required. I have named mine field group that will be used to list.

How to edit post field group in Toolset
What can I do to edit my Post field group within Toolset

3. Select Add New Field. You will then see an array of different types of fields that you could create. For example, if you were looking to include an online site, you can select URL or to add an address, you'll use Address or for a phone number, you could choose telephone. For the year of production We'll always display the year in order that it's ideal to pick the number.

How to add a new field in Toolset
What can I do to create an entirely new field in Toolset

4. Input the necessary details to your customized field, including the Field's Name along with the Field Slug. My field is named the Year of Production. The other fields don't matter for this field.

How to add details to custom fields
What information can I add to fields that I have created

5. Select Save the group of fields and your customized field will be displayed when you make edits to your blog post in accordance with your personal post type.

How custom fields are displayed on backend
How custom fields are visible on the backend

Create Custom Taxonomies

In my classic car directory, I've created taxonomies for the different types of vehicles I am listing. Here are the categories that appear when I make edits to an existing Listings page:

Custom taxonomies
Custom taxonomies

This is how I came up with it:

1. On the the Dashboard of the Toolset Click on the Add Custom Taxonomy button.

2. Input the name of your taxonomy in in the title name and description:

How to add custom taxonomy
What can I do to include the taxonomy of my choice that is unique

3. The second part is Taxonomy Type. decide if you'd like to use an taxonomy that is hierarchical or flat taxonomy. The Hierarchical taxonomy is a single taxonomy which is the taxonomy used by the parent (such such as Italian food) along with a set of taxonomies for children associated with the parent taxonomy (such as pizza, pasta and ice cream, pizza and so on ).). Meanwhile the Flat taxonomy is merely an assortment of classifications.

4. Select the kind of post you wish to classify the taxonomies. In this case I've given these taxonomies to the ones posting Post types that are custom.

Taxonomy settings
Taxonomy setting

5. Click to save taxonomy

6. Revert to the listing post type and when you alter one of your types of posts or create a new one, then you can start to add your taxonomy definitions.

7. Under the category of [Taxonomy Name] Click on Create New [Taxonomy name] category.

8. Input the name of the newly created category. You are able to choose the category you'd like to be a parent when the taxonomies you choose to use are more hierarchical.

Taxonomy terms assigned to listings
The terms of taxonomy that are that are assigned to listings

Then, use the checkboxes in order to add taxonomy terms for your listing.

An Example to Display Every of our Items

Once we've created our custom designs, the next question is to figure out how show it on the front-end? In order to do that, we'll design a template for every of our listings.

Here is how my template is displayed at the front of all my listings of classic cars:

Website listings template example
Website listings template example

1. Go to the Toolset Dashboard click Toolset Dashboard. Design a template within the middle of the post you have created. It will launch the Toolset Drag-and-Drop Editor for Layouts which allows us to select how we want to present the content.

Before we move on, let us give we'll provide an overview of how Layouts works and what are certain cells that you'll require.

Toolset Layout is based on the Grid built by Bootstrap which displays your site's pages with twelve rows in columns. In the case of a page that needs to show images in the left-hand side of your site, you need to select the top six columns on the left.

How to set up layouts
How do you set up layouts?

Use the + to include rows into the template.

If you select the cells you want to show content, there are two different types of cells which can be utilized for this specific task.

  • The content of your blog post to add any content that comes from the body of your article. In the blog post I wrote about my old cars, I'll add this section to display the specifics of each vehicle which I have included in the editing screen.
Layout cells types
Layout cells and types

We can now resume. We will continue to show how I presented the customized field for Production year found on the following image of my template:

How to display custom fields with the Visual Editor
Custom fields are displayed using the Visual Editor

2. Select the number of columns you'd like your cell to fill In my instance, I picked four columns.

3. Now, you will be able to view the Layout cell types which you're already familiar with. Select to launch the visually editor.

4. Click on the view and field where you will be directed to the list of shortcodes that we could use. Find the title of your custom field list (in my case , Field Group for listing) and click on Year of production.

Fields and views shortcodes
Shortcodes for fields and views

5. Click to insert a shortcode.

6. Our editor has a shortcode in its cell. Users now see the year of the production of the vehicle they've selected. But now we need to provide a description alongside the year, so that the users are aware of what year it refers to. I typed in the year of production as well as a little HTML in order to make an appearance. I've placed the shortcode inside an image below so that you can know how it appears:

Production year being added with shortcode and some HTML
Year of production added to the shortcode with some HTML

7. Click to add and the cell is completed.

Here's how it appears at the front end after a bit of CSS design:

How the custom field is displayed on the frontend
The way the custom field will be visible in the frontend

It is possible to create the search tool that has many filters that will help users locate the exact results they're seeking.

This is the search I have added to my site for classic car directories. I've added six filters that you can view above in the search bar

Search feature with filters
Search feature with filters

In the first place, what is the best place for your search results to be displayed? It can be displayed in a widget that you can place on your homepage or on its own website, within the form of an embedded widget, or in an archive.

I've added my personal search function to the homepage. This is how I accomplished it:

1. In the Toolset tab, Layouts create a new template and then press the button that allows you to add cells.

2. Choose one cell in view cell. cell view cell

Search results page layout
Layout of the page for results from a search

3. Then, choose to display the results in the form of a customized Search option. Then, click Create.

4. In the Content Selector Choose the post that you want to go through. In my example I'll choose the listing sort of posts.

5. In the Custom Search settings Custom Search settings Select what method you want to apply for updating your results. In this instance, for example, you could opt for AJAX updates (update the results of your search without the need to refresh the page) in addition to other choices.

Custom search settings
Custom search settings

6. The section that is that is called "Search tab" as well as Pagination under Search and Pagination In the section called Search tab, you have the option to add filters to your search. These users may use to limit their results. These can be customized fields, taxonomies and post-relationships. In my case one, I used this Price custom field to add an Minimum price along with the highest price filter for my search. Click on the filter that you want to add and then search for the field you'd like to be able to filter (in the example I used, it's Price). example, that's the price).

Add new custom search filters as shortcodes
Create new filters for search that are custom for your specific needs using shortcodes

7. The following page will change to the next one, and the choices to look like the below image and click to include the shortcode. This is how the Search or Pagination looks after I've applied my filters. The filters appear good straight out of the box, however I've added some CSS and HTML to style it.

Search and pagination with filters and HTML
Search, filters and filters as well as HTML

8. Click submit to create the button that people are able to click on to view the results.

9. Select the Reset to add an option that allows users to reset their filter.

The research we are conducting is ready to go. Only thing left to do now is design the results.

Create the Search Results

It is possible that we have created our own custom search. However, it's still important to select how our search results should be displayed. It is possible to do this within the exact same website page you created your search.

Below the search and pagination We can locate another area named Loop Editor that lets us create the output from the results.

The loop editor
The loop editor

1. Use the Loop Wizard. Loop Wizard and select how you want to display the loop. On my Classic Cars Directory website, I chose to use the Grid of Bootstrap using four columns for the final output.

The loop wizard window
The window of the loop wizard

2. On the next page, we will be able to add filters to appear on the page as a element of the results. The following are filters that I added on my vintage car directory website.

Setting up filters for the search results
Filtering results of a search

3. Click to finish. You'll then see the areas in your loop editor.

How the loop editor looks with fields
The editor of the loop appears to look like at the fields

4. Click to save your view at the end on this page.

5. Simply click Save the Layout, and it's available for use on the front-end.

Here is how mine looks:

Search layout example
Example of a search layout

Make a Front-End form

Front-end forms are a great method for users to post their listings in the format and style they want. All they need to complete is submit the form, and they will be able display the listing at the front end.

Here's an example the form I designed for my classic car directory website:

Front-end form example
Front-end Form Example

In the event that a user has the ability to fill out their application, this is the way it appears on the front end:

Cars listing template example
Cars listing template example

This is the way I did this:

1. Go to Toolset > Add Formulas, and then click "Add new".

2. A Toolset Wizard appears. A Toolset Wizard appears. for Continue and then enter a name that describes the layout.

3. In the setting area, users are able to fill the information that is needed for the submission. You can choose what the page visitors see when they have completed the form. You can also decide whether the listing is quickly published or published as a draft and when your listing is due to expire. This is what I chose as my default:

Display options for your front-end form
Optional display for front-end Form
Form editor fields
Formula editor fields

5. The last step lets users to modify the emails that administrators and users who are on the directory website receive upon submitting a registration. This is an example that I designed to notify the directory administrator of the fact that their article has been examined and declared active.

Email notifications settings page
Email notifications settings page

You are also able to send an additional email to different individuals if needed.

6. Next step is to present the form in the front-end. Similar to the other pages, I'll place it inside a cell on one of my Layouts. Visit the tab Layouts within Toolset create a brand new Layout and then click on the link to add cells.

7. Select the Post Formula cell and click to start a cell..

Save your Layout, and you will now be able to view your forms on the front end.

Summary

Like I've said, there are a variety of features like maps, membership sections as well as related listings that you could add to your directory site. These are however the most important ones to get started with in the shortest amount of time possible.

What are your thoughts regarding how you can build a directory site? Tweet us @ @ @We'll provide you with suggestions that are insightful! You can also share them with us in the remarks.

Save time, money and enhance site performance:

  • Help and support 24/7 provided by WordPress hosting experts, 24/7.
  • Cloudflare Enterprise integration.
  • Global reach with 34 data centers all over the world.
  • Optimizing through our App Performance Monitoring.

Article was first seen on here