JP AJAX Search - Display Settings
Article Index
- JP AJAX Search
- How to install & use
- Basic Module Settings
- Using Language Constants in Text Fields
- Source Status Overview
- Joomla Articles Source
- Product Sources
- Phoca Cart Source
- HikaShop Source
- J2Commerce Source
- OCH Subscriptions Source
- Document and File Sources
- jDownloads Source
- DOCman Source
- eDocman Source
- Event Sources
- Event Booking Source
- JEvents Source
- Frontend Style Presets
- Display Settings
- Smart Relevance Ranking
- Access Levels and Visibility
- Frontend Testing
- Troubleshooting
- Developer Notes
- Recommended Setup
- All Pages
Page 20 of 26
Display Settings
The Display tab controls how the search field and dropdown look on the frontend.
Frontend Style Preset
- Frontend style preset - Choose whether the module should use UIkit / YOOtheme, Bootstrap 5, or Generic JP Ajax Search CSS classes.
The selected preset affects the search field classes, but the AJAX dropdown and result rendering continue to use the stable JP Ajax Search base classes.
Search Field Layout
- UIkit search style - Select the UIkit-style search appearance. This is only used with the UIkit / YOOtheme preset.
- Use UIkit input class - Adds UIkit input styling to the search field. This is only used with the UIkit / YOOtheme preset.
- Search width - Controls the search input width.
Dropdown Layout
- Dropdown width - Controls the result dropdown width.
- Dropdown max height - Controls the maximum height before internal scrolling is used.
- Dropdown alignment - Align the dropdown left, right, or based on the module layout.
- Thumbnail size - Controls the thumbnail size in result rows.
Load More
- Enable Load more - Allows users to load more results inside the dropdown.
- Load more text - Text used for the Load more button.
- Maximum dropdown results - Maximum number of results that can be loaded into the dropdown.
The Result limit from the Module tab controls how many results are loaded per batch.
Missing Images
- Missing image behavior - Choose what happens when a result has no image.
- Fallback image - Select an image to use when a result has no image.
Available missing image behavior can include using a fallback image, showing a placeholder, or hiding the image area.
Result Type Labels
- Show result type label - Shows labels such as Article, Product, Document, Event, or Download in the result meta line.
Result type labels are translatable. For example, on a Swedish site Article can be displayed as Artikel.
Themes, Colors and Custom Classes
- Dropdown colors can help avoid white-on-white or dark-on-dark result panels.
- Custom classes can be added for site-specific styling.
- JP Ajax Search base classes are always included, regardless of frontend preset.
