Listbook Directory WordPress Themes Setup & Configure

1
Listbook - WordPress Directory Listing Theme

Listbook is a truly scalable WordPress Directory theme. It’s built with pure Gutenberg blocks, with template builder support, where you will able to import blocks very easy to build your page. It’s super fast WordPress Theme, It has Algolia based full text searching system that makes it amazingly fast.

Installation Download The Theme

Purchase Listbook theme and download the packages from ThemeForest. Unzip the package and you should get a listbook.zip fine inside the main zip file.

System Requirements {#system-requirement}

  • PHP version 7 or greater
  • MySQL version 5.6 or greater
  • Recommended memory_limit is no less than 64M
  • Upload_max_filesize should be no less than 64M

Theme Installation

  1. Goto to **Appearance->Themes **in your WordPress admin dashboard.
  2. Click Add new at the top of the page.
  3. Click Upload Theme
  4. Choose listbook.zip and click Install Now

**For better understanding the installation process please follow the below video URL **

Plugin Installation (Install Required Plugin)

After installing the theme you will be redirected to the theme welcome page. On the page, you will get a button to install all required plugins. See the below image.

Now click on All plugin Setup and you will be redirected to below page

Now click on the pointed link in the above image. You will be redirected to below page

Now select all plugin and install them. It might take some time as the plugin will be downloaded first and then will be installed. After installing all the plugin you will get the below messages

Now go to plugin list like above and select all plugin then activate

Now when the plugin activation is complete you will see a page like the below image

Now when the plugin activation is complete you will see a page like the below image

Congrats you have successfully installed all the required plugins. Now follow the next step Plugin Configuration.

Plugin Configuration Necessary Plugin Settings

After installing all the plugins you will be needed to configure a few plugin.

Google Map

In our theme we have used google map in our theme. So to get the full theme working you have to configure the google map api key from `Google Map` Dashboard menu.

Listbook Algolia

We have used Algolia in our theme for faster searching of listing and a better experience. To configure algolia settings you have to go to Listbook Algolia Dashboard menu and put the necessary credentials to the fields. In the Enter Index Name name put listing

You will get the credentials of the other fields from the algolia dashboard. You can get algolia api keys from here

Import Demo Data

Before importing demo data make sure you have completed the above two steps. At least install all the plugins and configure the Google Map plugin. If you have completed the above two steps you will now be able to import demo content. Without installation, all the demo import buttons would be disabled.

First, go to the Listbook Dashboard menu. You will see some like the below images. If you have completed the above two steps then you should be able to click on the Import Demo Data button.

import-demo-content

After clicking on the demo data button you will be redirected to the below page. Click the Import Demo Data button there and it will start importing demo data. Wait for a few minutes. It might take time 1-5 minutes depending on your internet speed.

importing-page

When the demo data import is completed you will get a message like below.

complete-demo-import

Now go to the frontend of your site and you will see all data has been imported and your site is ready.

NB: If you didn't configure Algolia before importing demo then you have to do a very small task. You will get the details in the Plugins/Listbook Algolia chapter. If you don't follow these steps properly then your explore page will not work properly.

Permalink Setup

This step is a very tiny but very very important step. Go to your admin Dashboard Settings->Permalinks and set the Post Name permalinks structure. You can choose any other permalink structure rather than Plain. Check the below image and follow the arrows.

Theme Settings

We have used kirki WordPress customizer framework to build our theme settings. You can go to theme global settings from the frontend using the customize button in the frontend admin bar.

customiser

In the customizer, you will see below settings menus

Now click on the Listbook Theme Panel menu and you will get below settings

Now If you click on the Header menu you will get below header settings to customize the theme header

theme-header-settings

Gutenberg Blocks

You can use anyone one these blocks. Just hover over the block and you can see its preview with a description of what this block represents.

Block Customization

Our blocks offer the same customizing capabilities as any other default Gutenberg blocks. If you select any block then the customizing settings will appear on the right side of the block. Check the below image for example

blocks-settings

All the settings are changed in real-time. If you change any settings then the changes will be reflected in the block instantly.

NB: For responsive settings like spacing it will only be reflected on the specific device which you are using to change the settings. Like you are changing it in the largest device then when you change the spacing settings for that particular large device it will only reflect the changes. When you change space for mobile it won't have any effect on your large device. But it will be rendered perfectly on every device in frontend. You don't need to worry about that.

Sections & Homepages

For our customer’s easy accessibility we have had all our demo sites sections and home pages available in our Listbook Layouts. You will get a Listbook Layouts button on your page above the Gutenberg editor. Check the below image

To import a section to your page click on the Listbook Layouts button and it will open a popup. In the popup, you will see a list of pre-defined sections. Just click any one of them to add it to your page. And then modify it as your need.

To add a homepage layout to your page go to the Homepage tabs besides the Sections tab. Now Choose any of the three predefined homepages.

NB: To get the full homepage view you might need to add a few Page Settings and change Page Attributes to your page. Page settings will be discussed in the Page Settings chapter. You have to make the page full width from Page Attributes Check the below image

Page Settings

To override any global theme settings for a specific page there is a page setting on every page. From that page settings, you can set quite a few specific settings for that page. Suppose you want to turn off banner for a page then you can easily do that from Page Settings

First, scroll down to the bottom to any page and you will find the below settings panel

Now suppose if you want to turn off the page banner then go to Banner tab and change specific settings. Check below image

After going to the Banner tab change the Select Option from Global to Local then turn Page Banner off from the next settings. Follow the arrow sign.

Plugins

In our theme, we have provided a few plugins. Check the specific plugin section for its corresponding settings and how it works.

Listbook Helper

Listbook Helper is the main helper plugin for the theme. In this plugin below tasks is done

  • Creating listing post type.
  • Creating Taxonomies for listing
  • Creating all the blocks
  • Creating the page settings.

To add/edit the listing for admin you will get a Listings menu in the admin Dashboard. From there you can add listing and taxonomies. It’s pretty simple basic WordPress things. So we are not discussing it in detail here.

Userplace

Userplace is used in the theme to provide the user subscription, frontend submission, frontend user dashboard, and many more. Everything you need to know about the plugin will get in the below links.

Userplace

Listbook algolia

This plugin is used to sync your local data with Algolia and providing a fast and reliable search using Algolia. In the plugin, you need to do two things.

  • Configure using Algolia API Keys
  • Sync all listing using the Sync All button from the algolia settings.

We have already discussed everything about configuring algolia in our Plugin Configuration chapter. Follow that instruction if you haven’t already configured that. If you have configured that before importing the demo data then you might not need the Sync All. But still, for being sure you can sync all data you won’t lose any data.

Now for syncing all data to algolia you have to press the Sync All button from the List Book Algolia Dashboard menu.

In the page you will see below section

When the sync is done you will get an admin notice like below image in the page top

Userplace Openform

Userplace openform is the plugin which provide the frontend submission facility in the theme. This plugin is an extension of Userplace plugin. If you have already checked the Userplace plugin docs and videos. Then you should understand easily the next section. If you haven’t configured Userplace first, either won’t understand the functionality of this plugin.

If you haven’t installed all the plugin during theme installation then please install all of the plugins before you go any further.

If you are a logged-in user then you should get an Add Listing button in the top right corner of the page. Click that button. You will be redirected to a page like below

In this add listing page, your user will be able to add listing from the frontend. You can check there is a bunch of forms there to add the listing.

You can check in the sidebar there is another menu All Listing which shows all the listings of the current user. Check below image

Userplace Post Claim Listing & Report

These plugins is also an extension of Userplace. The purpose of this plugin is to add Post Claim support to your site. If you have already activated the plugin then in your listing details page you will get a button. Click the button to claim the listing. You must have to be registered and logged in to claim the listing.

NB: Owner of the post won't see the Claim Listing button.

After clicking the Claim Listing button user will be redirected to the below page. From there the user can post his/her query to the admin and the admin will take care of the rest.

After sending his/her query user will see a page like below

Now user can continue the conversation with the admin until the admin rejects or approved the claim.

Users can check all of his/her claims from the My Claims menu in the sidebar.

Userplace Rating & Review

This is a rating and review plugin that integrates an advanced rating system in the WordPress site. Though its a Userplace addon but yet it has capabilities to work independently. To configure the plugin first of all You have to go the below page.

NB: If you have imported a demo then there is a review already configured for you.

The settings on the above page are pretty self-explanatory. Just build your review get going. If you have already configured the review then in the listing single page you will be able to post a review in a listing with the below form

If you submit reviews through the form then in the listing details page all the reviews will be distributed in the below way.

Userplace Social Login

Userplace Social Login is another extension of Userplace plugin. The purpose of this extension to add a popup login with social login support. If you haven’t activated this plugin in the plugin installation section then please activate the plugin first. Make sure you have activated and configured the Userplace plugin first.

To configure social login go to below page

We have implemented login popup in multiple paces in our site. Any action that needs the user to log in a popup with login will show for the user to login.

To add login modal action to any button just add the below action within HTML class.

do_action('listbook_auth_trigger');

An example of below code is given below

<button class="login-modal <?php do_action('listbook_auth_trigger') ?>">Login</button>

Now If you click on Login button then the login popup will appear.

Userplace Wishlist

Userplace Wishlist is another Userplace extension. The pupose of this extension is to add the wishlist functionality for a user on a listing. A user can add wishlist check all of his wishlist from console. If you have already configured the plugin then you should get a heart icon in every listing grid and in single page you should get another button to make take the listing to your wishlist.

Check below images

To show show all of your wishlist click in the below heart icon menu

Wishlist icon in listing details page

My wishlist page

Child Theme

In the theme package, you should get a file named listbook-child.zip. Upload this zip as a theme and activate it. Make sure you have already Listbook installed. Both the child and main theme must have to be installed but the child theme has to be activated.

How to update theme?

To update the theme first you have to download the latest version from ThemeForest. After downloading the theme goto Appearance->Themes. Then activate any other theme than Listbook theme. After activating another theme you have to delete the Listbook theme. To delete the Listbook click in the listbook theme grid and it will open popup. In the right bottom corner of the popup, you will get a button to delete the theme. Delete the theme and then install active the new theme in the usual way.

How to use a child theme?

In the theme package, you should get a file named listbook-child.zip. Upload this zip as a theme and activate it. Make sure you have already Listbook installed. Both the child and main theme must have to be installed but the child theme has to be activated.

How to optimize my site?

To optimize your site you can use below two free plugins. You can also configure CDN and for object caching you can also use Redis if your server supports it.
https://wordpress.org/plugins/wp-super-cache/
https://wordpress.org/plugins/autoptimize/
You can use any other caching plugin.

How to add a section or predefined page layout to my page?

Check the Gutenberg Blocks->Section & Homepages section in documentation.

1 COMMENT

LEAVE A REPLY

Please enter your comment!
Please enter your name here