Weโve all been there.
Staring hopelessly at our computer screens with a โwhat nowโ expression on our faces.
Sure googling for the next steps can help. But then youโre left trying to piece together bits of information to build a decent solution.
Things donโt always have to be this way. Especially when dealing with Listify setup!
Weโve done the piecing together of information for you, with simple to follow instructions, sans the developer jargon! ๐
I will guide you through:
And moreโฆ without importing the demo content.
Letโs dive right in!
Installing the Theme and Dependent Plugins
Now, Iโm going to assume you have purchased the Listify theme and are ready with a fresh new WordPress installation.
Step 0, is installing and activating the Listify theme!
Once you activate the theme, you need to install the needed plugins.
What I would have appreciated after theme activation, would be an automatic redirect to a โSetup Guideโ or โWelcome Pageโ. But that doesnโt happen, so donโt hold your breath for it. ๐
Just navigate to Appearance -> Setup Guide. Find the button โInstall Pluginsโ and click it. Donโt worry, the plugins do not get installed automatically; you are instead redirected to the Install โPlugins screenโ. (Alternatively, you could directly head over to Appearance -> Install Plugins)
Liftify recommends 10 odd plugins to be installed. However, out of the plugins listed, WP Job Manager and WooCommerce are the only plugins that are required. The others are recommended but not required.
Instead of installing all the recommended plugins, Iโd recommend you install only the required plugins to begin with.
With Listify, the listings are completely managed by the WP Job Manager plugin. So, letโs start by installing and activating the WP Job Manager plugin.
Setting Up WP Job Manager
WP Job Manager does provide a setup wizard, but Listify recommends you skip it, and manually create the pages.
Why is the setup wizard not recommended?
The reason could be because WP Job Manager creates pages for Job creation, editing and listing; with manual page creation you have the flexibility to create pages for listings of your choice- for e.g. listings, restaurants, services and so on.
Not a problem! Owing to the use of shortcodes, setting up the pages manually is pretty easy.
Creating Listing Pages
You need to create three pages:
- Submit Listing: Create a page named โSubmit Listingโ and add the [submit_job_form] shortcode and publish the page. Do note: Submit Listing and Edit Listing pages are required only if you want to allow other users to add and manage their own listings.
- Edit Listing: Create a page named โEdit Listingโ and add the [job_dashboard] shortcode on it and publish the page.
- Listings: The Listings page displays submitted listings. To create this page, add the [jobs] shortcode on it, and name it Listings. Set the โListingsโ template for the page, and publish it.
Once the pages have been created youโll need to update WP Job Manager settings.
WP Job Manager Settings
Just head over to Listing -> Settings. Here youโll be able to adjust WP Job Manager settings according to your preference.
Now, you could leave the settings under โListingsโ and โListing Submissionsโ as default; however I would like to bring your attention to a couple of settings you might want to adjust:
Under Listing Submissions:
- Account Role: If youโd prefer the account role to be different, for example say โOwnerโ, then youโd have to change the value of this option.
- Listing Duration: If you do not want listings to have an expiration date, clear this field.
PRO TIP: How to Create an โOwnerโ user role
- Install and activate the User Role Editor plugin
- Under Users->User Role Editor click on โAdd Roleโ
- Set the Role name (ID) as โownerโ, โDisplay Role Nameโ as โOwnerโ and โMake copy ofโ as โEmployerโ
- Click โAdd Roleโ
Set Pages
Under โPagesโ you will have to set the listing pages you have just created.
- Set โSubmit Listingโ as the Submit Listing Form Page
- Set โEdit Listingโ as the Listing Dashboard Page
- And โListingsโ as the Listings Page
Remember to always save any changes made.
Setting Up WooCommerce
WooCommerce is used as the e-commerce cart on your listings website with Listify. Once again, Listify recommends that you do not use the setup wizard, and the reasonโs the same. Since there isnโt a conventional store on your listings website, you probably do not need all the pages WooCommerce will create.
But instead of skipping the use of the on-boarding wizard altogether, hereโs what Iโd recommend. Just skip the first step, so that you do not create any pages. You can set the rest of the options as per your need.
Create My Account Page
Create a new page, add the WooCommerce My Account shortcode [woocommerce_my_account] on it, and publish the page. This page will allows users to login/logout from the frontend, and will also help them track their purchases/bookings.
Weโll not worry about creating a product at this moment. Weโll get to it in some time ๐
Creating the Homepage
So, up until now, we were focused on the backend. Letโs move our attention to the frontend for a while.
Your listing website needs a super amazing homepage. But when building one, just make sure you do not ignore essential elements. By far the most important element is the search option. If youโve noticed popular listing websites, this option is placed prominently right when the homepage is loaded. And you mustโve noticed the same on Listifyโs homepage demo.
To create the homepage, create a new page and set โHomeโ as the page template. You should be able to see the search option displayed on the page.
PRO TIP: To set an image as the background image of the search option, set it as the feature image of the page.
A great feature about selecting the โHomeโ template, is that you can add additional sections as widgets under โHomepageโ widgets. For example, as shown in the Listify demo, you can add a category image grid, and recent listings.
Why am I not able to see the listing categories section, even though Iโve added the widget?
This is because you do not have any listing categories added. Try creating a couple of listing categories and add listings to the category.
Alternatively, if you wanted complete control on the homepage design, you could use a page builder plugin like Visual Composer and leave the template as default or set it as โHome (Visual Composer)โ.
Now, once the page is ready set this page as the โFront Pageโ under Settings -> Reading. Create another blog page and set it as the โPosts Pageโ.
Creating Menus & Footer
Listify offers support for four menu locations:
- Primary
- Secondary
- Tertiary
- Social (Footer)
The primary menu is the top navigation bar, and is the ideal location to add the login option (or the โMy Accountโ page).
The secondary menu is where your main menu items can be added. By default Listify adds the โBrowse Categoryโ menu option to the secondary menu.
The tertiary menu is an optional menu, which can be displayed on certain pages using the โShow tertiary navigation barโ option in Page settings.
This menu is displayed below the page title.
The social menu is added right at the bottom of your page, and is the ideal place to add links to your social profiles. The reason being that Listify automatically displays icons for social networks when the relevant links are added in the menu. You can optionally choose to add links to the โTerms & Conditionsโ page, or the โPrivacy Policyโ page in this menu.
Wondering how to add an icon to each menu item? Itโs simple. Under Appearance -> Menu -> โScreen Optionsโ check the โCSS Classesโ option. Listify loads Ionicons, so you can use the icon name as a class to show the icon next to the menu name. For example, to display a clipboard icon next to the โListingsโ menu, set ion-clipboard as the CSS Class for the menu.
Adding Widgets to the Footer
The Listify theme provides a three column footer. You can head over to Appearance -> Widgets and add widgets under Footer Column 1/2/3 to display information in the footer.
The call to action right above the footer is also part of the footer and can be edited using an option under Appearance -> Customize -> Footer.
There are other options here too, that help you edit the copyright text and allow you to add an โAs Seen Onโ section.
Creating Listings
Moving on to the most important section โ Creating a Listing! ๐
Listings are the focus of your website. But, before we jump to creating a listing, letโs create a listing category. This will save us the trouble of having to edit the listing after creating the category.
Creating Listing Categories
Creating listing categories is pretty simple. Itโs just like creating categories for posts in WordPress. Go to Listings -> Listing Categories and add new categories.
Creating a Listing
To create a listing, go to Listings -> Add New.
- Add the name of the listing as the title
- Description about the listing in the post description
- Add the โListing Dataโ,โHours of Operationโ, โFeatured Imageโ
- Add images for the listing under โListing Galleryโ
- Categorize the listing under โListing Categoriesโโฆ and publish the post!
Your new listing should be created. Users of your site can create a listing from the frontend itself, using the โSubmit Listingโ page.
PRO TIP: If youโre wondering how you can add the โBasic Amenitiesโ section, you can do so using the WP Job Manager โ Tags plugin (to add amenities as tags).
Add Location Map
To add the listing location on the map, you need to add the geolocation coordinates to the listing. These coordinates have to be added as custom fields. For each field below, you have to add a new custom field:
- geolocated โ set this to 1 (this indicates that an address is available)
- geolocation_city
- geolocation_country_long
- geolocation_country_short
- geolocation_formatted_address
- geolocation_lat
- geolocation_long
- geolocation_postcode
You should get all of this above information by googling for the listing location. If you do not add this information, the location will not be marked on the map shown on the โListingsโ page.
Modifying the Listings Page
Now, weโve already created the Listings page, and if you are happy with its appearance, good for you! But if not, hereโs what you need to do! ๐
First things first, to display the map on your listings website, youโll have to create and set a Google Maps Geocoding API key.
- Go to your Google Developers Console API Manager, and create a โNew Projectโ,
- then go to Google Maps Geocoding API, and click โEnableโ
Enter the generated API key on your WordPress website under Appearance -> Customize -> Listings -> Map Settings
You could optionally add additional elements in a sidebar on the Listings page, by adding widgets under Appearance -> Listings -> Listings Archive.
Creating Listing Packages
Now, if you head over to โSubmit Listingโ page, you should be shown the submission form directly. But if you notice on the Listify demo page, there are โPurchase Packagesโ. These purchase packages are created as products in WooCommerce using the WC Paid Listings plugin.
- Go to Products -> Add Product
- Under Product Data, add โListing Packageโ as the product type
- Set the price, โListing Durationโ (if applicable), and publish the product.
Customizing the Theme
Apart from customizing the themeโs background, there are tons of other options available to customize the look of the theme under Appearance -> Customize.
- You can change the color scheme under Style Kit, or set custom colors yourself
- You can change the typography, map color scheme, listing layoutโฆ. and so on
If youโre good with the default look, you can leave the theme customization settings as is. To customize the theme beyond the options available, such as creating custom templates for Listify, youโll need to contact a theme developer.
TL;DR
Hereโs a summary of the tasks you need to undertake as part of Listify theme setup:
- Install the theme and WP Job Manager and WooCommerce plugins
- Create Listing pages (Submit Listing, Listings, Edit Listing) with WP Job Manager shortcodes and update WP Job Manager settings
- Setup WooCommerce, and create the account page
- Create the Homepage using the template provided by Listify and add widgets as needed
- Set the primary, secondary menu
- Add footer widgets, and customize the footer as needed
- Create listing categories and listing packages
Surely, there are quite a few plugins (recommended by Listify) which you could use to add more functionality on your website. But letโs save all that discussion for another day. ๐
For those of you who have used Listify to create their website, feel free to post any information that could be of help to our readers.
And for those of you, who need help setting up Listify, we would be more than happy to help you. Hereโs how we can set up the Listify theme on your website. ๐
Robin Reynolds :
Hi there! Iโm in the final stages of settings and had a question โ Iโm using woocommerce bookings with woocommerce vendor products in addition to the WP manager products tools. Do you know if thereโs a way to auto-create/auto-link a vendor to a listing owner account? Right now it looks like I have to create a vendor separate from the listing owner, and then go to my users and manually link those two together. Iโm not sure if thatโs right, especially because I still canโt figure out how to get the new products to show on the listing pages. Any advice would be great!
Reginald Parks Jr :
Have you all ran into an issue where the listings do not show up on the map? If so, might you have some solutions to this in this theme? I have done everything, though the listings are not showing up. My api is set up correctly and everything.
Thanks.
Astrid JONATHAN :
hello,
thanks for the tuto.
I need to differentiate client and pro pro can be reserved by client but i donโt understand how. i have booking products and vendors for woocommerce.
sos please
Osvaldo Melarรฉ Junior :
Hi everybodyโฆ
Is there how to link a specific product with a group of listings and depending the of the product customize fields to appear or not in this listing?
Regardsโฆ
Sathish :
Appearance -> Customize -> Listings this section not appearing in my wordpress console.
Because i just need to set my map API key under the above location -> Map Settings..
Can you please help on this. why i couldnโt able to see the option!
Greg Holborow :
How can you get help from listify?
Gรฉrald :
I found this plugin โRestaurants Listingsโ by opentuteplus on GitHub
It is in its initial phase, but works well. A lot of features of Listify is not there. I guess they will developed soon. It is free off course now and easy to set up.
Jack Dixon :
Hi. Do you know of I can restrict other elements to โpay onlyโ listings. Currently I can only change whether it is featured. But I want for examples that on a premium listing it shows Google maps and social media but on standard it doesnโt. Can this be done?
AJay :
Would wish if I could post price for each listing as I want to create a classified website. But the issue is it does not have such an option, and also I want to add image only for the gallery images for the product. Iโm not that technical so please could you help out.
Lavvy :
Looking for help to set up bookings with Woocommerce Booking on Listify site. Couldnโt find that here. Any pointers will be appreciated.
Anjali Sharma :
I found your article is much better then this themeโs author support. Step by step guide is really very informative and easy to understand. Many many thanks dear, i have been successfully installed and published my directory listing sites , and all credits goes to you.
Thank you so much!
Farid :
Hello Namrata,
I bought and installed Listify successfully, but after activation everything disappears: the website and even the WordPress Dashboard. The only way to recover the website is to go to phpMyAdmin and change the name of the theme manually to another installed theme.
All other templates work correctly, but Listify does not. It turn the whole website into a white blank page when activated. I installed WordPress 4.5.1, but the problem persists.
Please help
Farid :
the template has this error: Parse error: syntax error, unexpected T_PAAMAYIM_NEKUDOTAYIM in /home8/wikinter/public_html/wp-content/themes/listify/inc/setup/class-setup.php on line 148
Leo :
Hey there! I want to create a page wich displays a date (like from 1st of August till 9th of September) in the search fields on the top. How can I do this with listify?
Thx for your time!
Namrata :
Hey Leo,
Listify uses the FacetWP plugins to create custom filters. Youโll need to create a facet with date range fields and then add it to the results page. Hereโs a link that should help you out: http://listify.astoundify.com/article/1007-choose-facets-to-filter-listings
Yagnesh Kaklotar :
Thanks for guiding many of us namrata.
here is a question,as seen on listify demo,can we show profile pic of user after he or she log in into account,and if yes,how can we do that?
will wait for your reply.Thanks in advance.
Namrata :
Hey Yagnesh,
By default, the Gravatar associated with a userโs email address is displayed as the profile picture. To allow users to upload their own avatar, Listify recommends using the WP User Avatar plugin.
Just add the [avatar_upload] shortcode on WooCommerceโs โMy Accountโ page.
Hope this helps!
Martin :
Hi, this is great, I am trying to make it work. But I am get confused with some topic: I have two items in my dashboard to create listings. One of them is โProductsโ who provides limited support to Listify, and โListingsโ which provide useful Listify widgets but are less cool than Products. I am not really sure which to use.
Regards and thank you for this tut.
Martin
Ayush Chandel :
How can we create a page which display listings from just one category and a page which display listings from just one vendor ??
Cristian :
Listify is awesome! Thanks for this tutorial, it helped me set up https://www.nationwidewraps.com !
Reginald Parks Jr :
How did you get your listings to show. For some reason I am running into an issue where the listing are not showing when I make hypothetical listings. I hope that you can be of help.
Julian :
I have the woocommerce bookings, product vendors as well as wp Job manager โ products plugins, with which I would like to allow clients to add a listing (space) and then link a product (time) to that listing so that the time can be booked and paid for by visitors. When creating a new listing, the option to add a product is there. But the product is not visible in the lsiting?
jonathon :
Hey there, for some reason on my plans and pricing page nothing is showing up! its driving me crazy โ everything is set up correctly too
Bostjan :
Maybe you set up a product to be hidden. On the left side where the publish button is there is Catalog visibility: set it to Catalog/search
Bostjan :
I have been playing with listify theme for a while now. I have to say it is really pain in the ass. It is good theme but you have to buy aaaa loot of plugins to get all the features and even than you have to do some things manually.
I just hope I will finish it soon so I can start making some revenue. ๐
Namrata :
Bostjan,
Hope youโve setup your site! ๐
Bostjan :
I think I did ๐ and now the hard part lol create all the content โHow toโ etc. I hate writing, but what has to be done has to be done.
Namrata :
Hahaha! Stick with it. ๐ Wish you a lot of success with your venture!
Bostjan :
Thanks ๐