Introduction
Liferay provides set of out-of-the-box widgets to build a powerful search experience, including a configurable Search Bar widget. Traditionally, the search bar supports default suggestion options like popular keywords or categories. However, with Blueprints, you can now configure custom search suggestions based on specific content, such as entries from custom objects.
This guide walks you through configuring custom search bar suggestions using Blueprints in Liferay.
Prerequisites :
Liferay DXP/Portal 7.X
Basic knowledge of Liferay (objects, pages, and widgets)
Environmental Requirements :
Liferay DXP
Steps to Configure Custom Suggestions in Search Bar Using Blueprints
Step 1 : Create Custom Objects and Add Entries
- We’ll first create a few custom objects to provide data for the search suggestions.Create Two Custom Objects. In this example, events and news are created.
Add Fields to Each Object. (Title and description)
Add Sample Entries.
Step 2: Create a Blueprint for Search Page
Blueprints allow you to control what data appears in search results and suggestions.
Go to Applications > Search Blueprints.
Click Create New Blueprint.
Add a name and optional description.
- Under Query Settings, choose objects: Event and News.
This ensures only these object entries are included when we use this blueprint on the search page.
Step 3: Create a New Search Page
We’ll now create a page to display search results using the configured blueprint.
Go to Site > Site Builder > Pages
Create a new page (Search Page)
Add the following widgets:
Search Bar
Search Results
Blueprint
Search option (Allow Empty Searches)
Configure the Blueprint Widget and select the blueprint you created in Step 2
Step 4: Configure Search Bar
You can now configure the blueprint for your search bar to control what suggestions appear.
Open Configuration for the Search Bar Widget. You’ll see default suggestion options.
Default view of Liferay’s default search suggestions
Step 5: Customize View of Search Suggestions
Sometimes a single list of search suggestions isn’t enough. For example, you might want to differentiate between News and Events in the search suggestions so that users can easily identify the type of content they’re seeing.
With Liferay Blueprints, you can achieve this by creating separate blueprints for each content type and displaying their suggestions under distinct headings.
Create two blueprints :
News Blueprint : Create a blueprint and select News in the query settings.
Events Blueprint : Create another blueprint and select Events in the query settings.
We will configure these blueprints in search suggestions.
To customize the search suggestions view :
Configure the Search Bar widget
Open the Search Bar configuration.
Delete Liferay’s default suggestions.
Click “Add Blueprint” to include custom suggestions.
Add two blueprints
One for News, One for Events
For each, you can specify a Group Name to label the suggestions.
You can also do other configuration options as needed.
Save the configuration and publish the page.
Now, when a user enters any keyword, the search suggestions will appear in a customized grouped view, clearly separating News and Events.
This is how you can use Liferay’s Blueprints in the Search Bar suggestions to deliver a more structured user experience.
Conclusion
This way, you can customize search suggestions for your content. It offers a more focused and user-friendly search experience based on your business needs.
