BLACK FRIDAY 2017 - Click here to get a 40% discount on all downloads

Video Transcript

Today we will show you how to build a City Directory Website, with a free WordPress Plugin

Where users can register and login

login

and they can submit listings from a front-end form.

add-listings-form

Where listings can be search near a zip code or street address

search-zip

and results are returned ordered by proximity.

results-by-proximity

Finally, where users can review listings.

reviews

Let’s get started.

1) Assuming you already have WordPress installed, from the dashboard hover over the Plugins menu and click on add new.

add-new-plugin

2) In the search plugin form, type GeoDirectory and hit enter.

type-geodirectory

3) Install the GeoDirectory plugin by clicking on the Install Now button

install-geodirectory

4) activate the plugin.

activate-geodirectory

5) We also need a Google Maps API key, creating it is very simple, a link to the Google maps API key tutorial is available here.

google-maps-api-key

6) For this demo we created an API key in advance, that we will copy…

gmap-api-key

and paste in the required field.

gmap-api-key2

7) Now GeoDirectory is installed and you can set the default location for your free city directory. In this tutorial we will use New York City.

set-default-location

8) For GeoDirectory to work correctly, we still need to change the default permalinks. We suggest to use the post name option.

permalinks-postname

9) Now you can import the dummy data and get some examples to work on

dummy-data

or import your final categories and listings through our CSV file import option. In this demo we’ll show you how to import via CSV file.

import-csv-options

10) To do this, we need a CSV file for our categories

csv-categories

and one for the listings.

csv-listings

11) The sample file can be downloaded from the import and export options page.

csv-sample-file

12) We will also need images for the listings

images-for-listings

and map icons for the categories.

category-icons-for-.maps

13) A link to the documentation for Import and Export options is available here.

geodirectory-import-documentation

14) Let’s proceed with the import. 1st of all, we must import categories.

import-categories-csv

Once the import is completed, the system will tell you where to upload the image files, make sure to take note of the folder path.

import-categories-completed

15) Now we can import the listings too.

import-listings-csv

After the import is completed, the system will tell you where to upload the image files, it should be the same folder previously noted down, but you should always double check.

import-listings-completed

16) It’s time to import the map icons for the categories and images for the listings. We’ll do that using a FTP client and we need to upload them on to the folder previously noted.

transfer-images-icons-ftp

17) Here are our categories with icons

category-with-icons

and here are our listings, with images.

listings-with-images

18) Finally we can install the Supreme Directory Child Theme, but first we need to install our free Directory Starter, the parent theme.

install-directory-starter

19) Install it, but don’t activate it. Click on return to theme installer.

return-theme-installer

20) Next we need to install the Supreme Directory Child theme, you can download it for free from the GeoDirectory official website.

download-supreme-directory

21) Click on Upload Theme, Then Browse and select the zip file from your desktop and click Install Now.

install-supreme-directory

22) Finally Activate it.

activate-supreme-directory

23) We are almost done. We still need to add the Directory links to the main navigation. This is done via : GeoDirectory, Design, Navigation and selecting the menu location where we want to add the links.

geodirectory-menu-items-missing

24) The links are now visible in the menu.

geodirectory-menu-items-added

25) The Home Page content below the featured image, can be edited with your favorite page builder. We used Beaver builder lite for our demo and you can see how its back-end looks like.  It’s super easy to get the job done.

beaver-builder

26) Search results and listings pages are already setup

search-listings-page

and so are the listing details pages.

listing-details-page

That’s about it. Features are endless and you can extend GeoDirectory with several premium add-ons. Like the Location Manager to extend the directory beyond the default location or the Payment Manager that allows to collect Payments for featured listings.

We hope you enjoyed this tutorial, thanks for reading!

6 thoughts on “How to use our WordPress Directory Plugin

  1. Hello

    Awesome work! Kudos

    One question. Is it possible to change the copyright footer to something else, if so, how do you do it.

    Thx in advance

    • Hi,

      yes you need to move a copy of footer.php from the directory starter theme, inside the supreme child theme and modify it.

      Thanks

  2. Hi,

    I’m trying to add new users but it says, “new user registration disabled.” How do I enable that?

    Thank you for your help!

    Best,
    Tim

    • Hi Tim,

      That is a WordPress setting, you can enable it under Settings>General>Anyone can register

      Thanks,

      Stiofan

  3. Hey there,
    Is there a way to only allow certain users to create listings. I’m looking to have companies list themselves after paying. It seems now that anyone signed up can create a listing.

    Thanks and awesome theme!!!
    Dan

    • Hi Dan,

      With the payment manager you can charger for listings direct which means only real business owners will add a listing.

      Thanks,
      Stiofan

Leave a Reply

Your email address will not be published. Required fields are marked *

Share This