The Listings Slider & Carousel extension allows you to display your directory listings in a stylish slider or carousel layout anywhere on your website. This helps attract more attention to your listings and provides a modern, dynamic browsing experience.
Installation: #
Firstly, Navigate to this Directory Listings > Themes & Extensions > Sign in And install and activate the plugin.
Settings: #
Navigate to this Directory Listings > Settings > Extensions > Listing Slider & Carousel path. Users will get multiple customization options here.
The settings option is divided into three parts, which are explained below:
- General settings:
Display By: Users can set the display type to either ‘Slider’ or ‘Carousel’ from here.
Listing Type: Users can select the listing type to display from here.
Total Number of Listings: Users can determine the total number of listings.
- Listing Slider Settings:
Slider Image Cropping: If the slider images are not in the same size, it helps automatically resize.
Custom Width & Height: Users can change the height and width of the listings slider from here.
Display Title: Users can show or hide the title of the listing.
Excerpt Words Limit: Users can set the word limit from here.
Display the Thumbnail on the Slider and the number of Thumbnail Columns, Navigation: Users have the option to display the thumbnail on the slider and determine the number of thumbnails that will be displayed and also have the option to hide/show the navigation icon.
Display Slider Navigation: Users have the option to hide/show the navigation icon.
Autoplay & Autoplay Speed: Users can turn off/on the Autoplay feature and also determine the autoplay speed.
- Listings Carousel Settings:
Carousel Image Cropping: If the slider images are not in the same size, it helps automatically resize.
Custom Width & Height: Users can change the height and width of the listings Carousel from here.
Display Title: Users can show or hide the title of the listing.
Display Publish Date & Category: Users have the option to display the publish date and category of the listing.
Custom Height: Users can determine the number of columns on the desktop view and it will adjust the hide automatically.
Number of Columns on Tab: Users can determine the number of columns on the Tab view.
Number of Columns on Mobile: Users can determine the number of columns on the Mobile view.
Display Carousel Navigation & Position: Users have the option to hide/show the navigation icon and also can set the position.
Autoplay & Autoplay Speed: Users can turn off/on the Autoplay feature and also determine the autoplay speed.
Page Setup:
Navigate to this Pages > All Pages path, activate the edit mode of any existing page, and insert the following shortcode in the suitable position: [directorist_slider_carousel].
On the other hand, users can create a new page and use the following shortcode: [directorist_slider_carousel].
Shortcodes:
There are numerous shortcodes are available to display the listing slider & carousel.
- display_by: Display all listings by slider or carousel view. The default is slider. Example: [directorist_slider_carousel display_by=”carousel”].
- listing_type: Options available : a_to_z, z_to_a, latest_listings, oldest_listings, popular_listings, price_low_high, price_high_low, random_listings. (Default is latest_listings) Example [
Settings can be found going Directory Settings >> Extensions Settings >> Listing Slider & Carousel. The [directorist_slider_carousel] shortcode can be used to display listing slider & caorusel.
Shortcode Attributes for Slider #
- display_by: Display all listing by slider or carousel view. Default is slider. Example:
[directorist_slider_carousel display_by="slider"]. - listing_type: Options available : a_to_z, z_to_a, latest_listings, oldest_listings,popular_listings,price_low_high,price_high_low,random_listings. (Default is latest_listings) Example
[directorist_slider_carousel listing_type='latest_listings']. - number_of_listing :
[directorist_slider_carousel number_of_listing='10'] - slider_cropping:
[directorist_slider_carousel slider_cropping='yes'] - slider_image_width:
[directorist_slider_carousel slider_image_width='668'] - slider_image_height:
[directorist_slider_carousel slider_image_height='419] - display_slider_title:
[directorist_slider_carousel display_slider_title='yes'] - display_slider_excerpt:
[directorist_slider_carousel display_slider_excerpt='yes']. - excerpt_words_limit :
[directorist_slider_carousel excerpt_words_limit='35'] - display_thumbnail :
[directorist_slider_carousel display_thumbnail='yes'] - slider_thumbnail_columns:
[directorist_slider_carousel slider_thumbnail_columns='4'] - slider_navigation:
[directorist_slider_carousel slider_navigation='yes'] - categories: Display specific category by category slug. (Example
[directorist_all_listing categories='food,travel,medical']) - tags: Display specific tag by tag slug. (Example
[directorist_all_listing tags='car,book,medicine']). - locations: Display specific location by location slug. ( Example:
[directorist_all_listing locations='new-york,michigan']) - ids: Display specific listing by listing id. ( Example:
[directorist_all_listing ids='1,2,5'] - featured: Display listing on slider with featured. It has two options ( ‘yes’ & ‘no’) default is
[directorist_slider_carousel feature='yes'].
Shortcode Attributes for Carousel #
- display_by: Display all listing by slider or carousel view. Default is slider. Example:
[directorist_slider_carousel display_by="carousel"]. - listing_type: Options available : a_to_z, z_to_a, latest_listings, oldest_listings, popular_listings, price_low_high, price_high_low, random_listings. (Default is latest_listings) Example
[directorist_slider_carousel listing_type='latest_listing']. - number_of_listing :
[directorist_slider_carousel number_of_listing='10'] - categories: Display specific category by category slug. (Example
[directorist_all_listing categories='food,travel,medical']) - tags: Display specific tag by tag slug. (Example
[directorist_all_listing tags='car,book,medicine']). - locations: Display specific location by location slug. ( Example:
[directorist_all_listing locations='new-york,michigan']) - ids: Display specific listing by listing id. ( Example:
[directorist_all_listing ids='1,2,5'] - featured: Display listing on slider with featured. It has two options ( ‘yes’ & ‘no’) default is
[directorist_slider_carousel feature='yes']. - featured_only: Display only featured listing. It has two options ( ‘yes’ & ‘no’) default is
[directorist_slider_carousel featured_only='no']. - carousel_cropping:
[directorist_slider_carousel carousel_cropping='yes'] - carousel_image_width:
[directorist_slider_carousel carousel_image_width='213'] - carousel_image_height:
[directorist_slider_carousel carousel_image_height='160'] - display_carousel_title:
[directorist_slider_carousel display_carousel_title='yes'] - display_carousel_publish_date:
[directorist_slider_carousel display_carousel_publish_date='yes'] - display_carousel_category:
[directorist_slider_carousel display_carousel_category='yes'] - carousel_columns_desktop:
[directorist_slider_carousel carousel_columns_desktop='4'] - carousel_columns_tab:
[directorist_slider_carousel carousel_columns_tab='2'] - carousel_columns_mobile:
[directorist_slider_carousel carousel_columns_mobile='1'] - carousel_navigation:
[directorist_slider_carousel carousel_navigation='yes'] - carousel_navigation_position: Options available : top,middle,bottom. (Default is middle) Example
[directorist_slider_carousel carousel_navigation_position=middle]