Smart Logo Showcase – Responsive Clients Logo Gallery Plugin for WordPress -Documentation

Installing Instructions

  1. Unzip smart-logo-showcase.zip
  2. Upload all the files to the /wp-content/plugins/samrt-logo-showcase
  3. Activate the plugin through the ‘Plugins’ menu in WordPress.
  4. For customizing the plugin’s settings, click on Smart Logo option menu in WordPress left admin menu.
  5. To display the smart logo showcase in the frontend, please use dynamically generated shortcode from shortcode smart logo showcase usage metabox.

Once the plugin is installed and activated you will find a menu named “Smart Logo” in the left menu bar of the admin menu. Once you click on that menu , you will go to the plugin’s listing page and you will also see the add new button, once you click on that button you will go to the logo showcase page where you can create logo showcase. Basically there are 2 type of logo showcase type i.e with filter and without filter with its own settings configuratons which is individually described below.


Smart Logo Showcase Manager

Smart Logo Showcase Manager

This is the landing page for plugin. Here you can see the listing of the logo created. Here you can see Add new button at top of smart logo listing table. For creating a new smart logo showcase , you will simply need to click on the Add New submenu of the Smart Logo menu or click on the Add new button in the smart logo manager’s listing table. You can also edit or delete smart logo showcase from here.Once you click the button, you will be redirected to the new logo builder page where you can add the unlimited numbers of logo showcase.


Smart Logo Showcase Builder Page

This is the builder page, it is divided into two main box Logo Showcase and General Settting metabox. In logo showcase you can add logo images and create your logo showcase by selecting the logo type in logo showcase metabox. And from general setting you can mangae the logo layout and it’s respective settings. Below are the detail description for each logo types and it’s layout.


Creating Grid Layout

First of all, you have to select the option without filter in logo type. And after that you can add multiple logo images through Add Logo button. As shown in below screenshot.

Smart Logo Showcase Add Logo

When you will click on Insert Logo button then selected logo images will be inserted in logo showcase metabox as shown in below screenshot.

Logo Showcase

Here each logo has its respective settings which are described below:

  • Edit : To change logo images you can click on this edit icon and select the required image logo.
  • Move : To sort and drag the logo images you have to use this icon.
  • Clog : To set the detail description of logo you have to use this icon. You can manage the logo detail by clicking in clog icon. When you will click the setting/clog icon a popup will open from there you can set the tittle, logo description, other settings as shown in below screenshot.
    Logo detail
    Logo detail

    Below are the detail description of each field:

    • Logo Title : This is used for showing the title of logo.
    • Description Heading :This is used for showing heading of logo description for example ‘About Us’.
    • Sub Heading : This is used for company tag line.
    • Image Gallery : This is used for adding images gallery into your logo detail.
    • Contact Info : This is used for showing contact detail in your logo full view templates. If you will enable, the contact detail field will be shown where you can enter the contact address, phone number and other details.
    • Social Icon :This is used for showing social links in your logo full view templates.
    • External Links :This is used for showing external links of your company.

Grid General Settings

Logo Showcase

Below are the detail general settings description for grid layout.

  • Title Settings : This is used for showing title in overlay or hover.
  • Image Effects : This is used for showing overlay effects or hover effects in your logo images. If you will choose the hover effects then hover type field will appear.
    Hover Effect

    The hover effect is of 7 types which are described as follow:

    • Type 1 Grey Scale Effect 1: When you hover , the image will be grey.
    • Type 2 Color Effect: When you hover , the image will have light blue color effect.
    • Type 3 Zoom In Effect: When you hover , the image will be zoom in.
    • Type 4 Flip Effect: When you hover , the image will be flip.
    • Type 5 White In and Out effect: When you hover , the white color will ease in and out on image.
    • Type 6 Blur Effect: When you hover , the image be blur.
    • Type 7 Grey Scale Effect 2: Every image will be grey and
      when you hover, the image will be in its original color.
  • Layout : This is used for choosing the layout for logo. For Grid layout you have to choose grid option, then setting related to grid will appear.
  • Grid setting
    Logo Showcase

    In above grid setting you can select the template and you can also manage the respective template settings.
    You can also manage the number of columns to show in desktop, mobile and tablets.

  • Full view setting :
    Logo Showcase

    This is used to show full details of company in either inline or popup view. There are 3 different templaes for each inline and popup view.


Creating List Layout

First of all you have to create logo which is described in above Creating Logo section. After that in general settings you have to select the list option in layout field.
Then the settings related to list will appear which are described below in detail:
list layout
List Setting : This is used for selecting the template for list.Here you can manage the list title and description’s font size, color. As shown in below screenshots:
list settings
And the other settings are same as that of grid settings which are described in above Grid General Settings


First of all you have to create logo which is described in above Creating Logo section. After that in general settings you have to select the carousel option in layout field.
Then the settings related to carousel will appear which are described below in detail:
list layout

  • Carousel Setting : This is used for selecting the template for carousel. Below are the detail description for each fileds.
      • Carousel Type : This is used to show slider either in horinzontal or vertical template.
      • Carousel Tempaltes : This is used to select template for horizontal slider. It is of 10 types.

  • Pager Settings : This is used for showing pager in the slider. Here you can select the pager template and manage it’s respective active and pager color as shown in below screenshots.
    Pager Setting
  • Slider Options Settings : This is used for controling slider configuration options which are described below in details:
    Pager Setting

    • Autoplay : This is used to show autoplay or not in slider.
    • Controls : This is used to show navigation controls or not in slider.
    • Autoplay : This is used to show autoplay or not in slider.
    • Count of slide : This is used to manage the number of logo to show in slider.
    • Autoplay Timeout : This is used to manage the autoplay time or speed of slider.
    • Controls Type : This is used to show controls either in text or arrow.
    • Arrow : This is used to manage the arrow templates for slider. According to arrow types you can manage the arrow colors and arrow hovers color.
  • Full View Settings : The full view settings is same as that of grid settings.

Creating Flipster Layout

First of all you have to create logo which is described in above Creating Logo section. After that in general settings you have to select the flipster option in layout field.
Flipster Layout

The flipster layout settings include following settings:

  • Slider Options Settings : The slider settings are same as that of carousel settings which are described already
  • Flipster Settings :
    Flipster

    This is used for selecting the templates for flipster.

  • Full View Settings : This settings is same as that of carousel settings.

Creating Filter Layout

Filter layout

For creating filter layout, first of all you have to select the with filter option in Logo type field.
After that one empty text field and Add filter and Add logo button will appear.
To add filter you have to enter the filter name in empty text field and after that just click Add filter button to enter the filter. You can add multiple filters and then you can add multiple numbers of logo images by clicking on Add Logo button. To enter logo in each filter just click on filter tab and then add the logo images by clicking on Add Logo button. The images will be added to active filter tab as shown in below screenshot.

Filter detail

Here each logo has its respective settings which are described below:

    • Edit : To change logo images you can click on this edit icon and select the required image logo.
    • Move : To sort and drag the logo images you have to use this icon.
    • Clog : To set the detail description of logo you have to use this icon. You can manage the logo detail by clicking in clog icon.When you will click the setting/clog icon a popup will open from there you can set the tittle, logo description, other settings as shown in below screenshot:
      Logo detail
      Logo detail

      Below are the detail description of each field:

      • Logo Title : This is used for showing the title of logo.
      • Description Heading : This is used for showing heading of logo description for example ‘About Us’.
      • Sub Heading : This is used for company tag line.
      • Image Gallery : This is used for adding images gallery into your logo detail.
      • Contact Info : This is used for showing contact detail in your logo full view templates. If you will enable, the contact detail field will be shown where you can enter the contact address, phone number and other details.
      • Social Icon : This is used for showing social links in your logo full view templates.
      • External Links : This is used for showing external links of your company.

General settings

general settings

The general setting include title settings, image effects settings, filter configuration option settings, full view settings.
Below are the detail description of each settings:

      • Title settings : This settings are already discussed in above grid settings.
      • Image effects : This settings are already discussed in above grid settings.
      • Filter Settings : general settings

        The filter setting include following settings:

        • Filter Type : This is used to show filter in normal effect or in blur effects. You can enhance your group of logo images with our blur effect.
        • Filter Tab Template : This is used to select filter tab for filter logo. There are 6 different filter tab to include in your filter logo templates.
        • Filter Layout : This filter layout is of 4 types which is described below
          • Same size : This is used to show image of same width and height in frontend. The same size have two different template to choose from.
          • Packed : This is used to show image of different width and height in frontend.
          • Same Height : This is used to show image of different width and same height in frontend.
          • Same Width : This is used to show image of same width and different height in frontend.
        • Logo Width : This is used to fix the width of logo image. You can crop the logo width image.
        • Logo Height : This is used to fix the height of logo image. You can crop the height of logo image.
        • Logo Height : This is used to fix the height of logo image. You can crop the height of logo image.
        • Delay Mode : This is used to set transition delay property. Progressive delay mode increases the transition-delay property of your items consecutively by the amount you’ve set the Delay option in below field. Alternate delay mode sets the transition-delay property of every other item to the amount you’ve set the delay option in below field.
        • Delay : This is used to set transition delay timing property for delay mode.
          If you choose Progressive delay mode then please select a value between 25-50 ms for an optimal effect.
          If you choose Alternate delay mode then please select a value between 250-400 ms for an optimal effect.
        • Animation Duration : This is used to set animation duration for filter.
      • Full View Settings :

        This is used to set full view of logo detail in popup. There are two types of popup template as shown in below screenshots.

        full view setting


Smart Logo Showcase Usages

full view setting

In Smart logo showcase Usage metabox you can get the shortcode for page and theme which you can copy & paste the shortcode directly into any WordPress post or page or theme.


This documentation tried to cover as much details about plugin to ease your plugin experience. To see screenshots of plugin backend and frontend templates, you can see them here

  • Construction - A beautiful Multipurpose WordPress Theme is now available for FREE DOWNLOAD
  • Bloger is a FREE responsive WordPress theme for bloggers! Try it now!