Styling Joomla’s Smart Search Results to Look Like AZDirectory Output

The AZDirectory module does not include a search feature. However, leveraging Joomla’s Smart Search capability and the flexibility of the AZDirectory module, a tailored search feature styled to look like the module’s output is possible with some careful configuration and a couple of component layout overrides.

Check out the demonstration.

To achieve this functionality, follow these steps after successfully logging into the Joomla administrative area:

  1. Ensure the Smart Search – Contacts plugin in enabled.
    Go to System. Under “Manage”, click “Plugins”. Search for “Smart Search” and ensure “Smart Search – Contacts” is enabled.
    Screenshot of Plugins page showing the Smart Search - Contacts plugin enabled.
  2. Index the contacts.
    Go to Components > Smart Search > Index. If this is your first time using Smart Search, click the “Start the indexer” button. If you’ve already indexed content, click the “Index” button to include your contacts.
  3. Create a Smart Search filter specifically for contacts.
    The power of Joomla’s Smart Search feature is the ability to create tailored filters specific to your needs. Go to Components > Smart Search > Filters. If this is your first time creating a filter, click the “Add a filter” button. If you’ve already created a filter, click the “New” button.
  4. Configure your filter.
    Give the filter a “Title” and toggle just the “Contacts” checkbox under “Search by Type”. You can fine tune your filter by “Category”, “Language”, “Region”, “Country”, etc. Save & Close.
    Screenshot of Filter page showing Contacts checked.
  5. Create a Smart Search menu item.
    Go to Menus and add a new menu item to your appropriate menu. Give the menu item a title and select Smart Search > Search as the Menu Item Type. Select your previously configured filter from the Filter dropdown. Take the time to carefully review the settings under the “Options” and “Advanced” tab, as there are many configuration and display options for the appearance of the search results. Save & Close.
    Screenshot of menu item page showing the correct Menu Item Type and Filter selected.
  6. Create a dedicated instance of the AZDirectory module.
    Go to Content > Site Modules and create a new AZDirectory module. Configure the module to your needs, but explicitly set “Default Letter” to “None” and “Alphabet Listing/Dropdown” to “No”. This hides the module but loads the necessary JavaScript and stylesheets to replicate the display of the module output for the smart search results. Under “Menu Assignment”, assign the module to the previously created Smart Search menu item. Save & Close.
    Screenshot of AZDirectory module options showing Alphabet Listing/Dropdown set to No.
  7. Upload the com_finder layout overrides within your template’s directory structure.
    Download the com_finder layout override ZIP package.
SHA256 checksum


SHA384 checksum


SHA512 checksum


The package contains the following directory structure:


Per the component layout overrides instructions, upload the two PHP files to:

  /[your template]
      /com_finder (this directory matches the component directory name)
        /search (this directory matches the view directory name)

Following these steps will provide a robust search capability with the same display, functionality, and flexibility of the AZDirectory module. If you like the AZDirectory module, please consider leaving a review at the Joomla Extension Directory.