Overview
The Search Panel dashboard widget allows you to add a search function to your app home screen. This enables app users to search using keywords to quickly and efficiently find specific information, such as articles, activities, or other pieces of content within your app.
📌 This widget is available for mobile applications only.
Step 1: Add the Search Panel widget to your Dashboard
1. In Cogniss Creator, navigate to Dashboard in the left sidebar.
2. Click on Add new widget in the top right of the page.
3. In the Dashboard widgets library, search for the Search Panel widget and click Add. Return to the Dashboard by clicking on the cross in the top right.
4. The Search Panel widget will now be on your Dashboard and ready for you to configure as needed.
5. Click Save Changes at the bottom of the page.
Step 2: Configure the Search Panel widget
The Search Panel dashboard widget is made up of three components:
Searchbar - the input field where the user can type the keywords they’re searching for. By default, this is displayed when the widget is enabled.
Text - a description/caption that can be added and appears above the search bar.
Prompts - similar to Text, you can add Prompts to show alternating messages to users to provide guidance on how and what to search for.
You can also define the order of these components by entering 1, 2 or 3 correspondingly in the Search bar order fields. This allows you to customise whether text and prompts are shown above or below the search bar.
Searchbar
1. By default, the searchbar is displayed in your app when the widget is enabled. You can add Placeholder text if you wish to. For example, this can be Search App Name.
2. Update the Search bar order to 1 if you’re not using any other components in the Search Panel widget.
3. Once you have updated the widget, click Save Changes at the bottom of the page.
4. Open your app to preview your Search Panel widget and to test that it works as expected.
Text
1. If you wish to add some text in your Search Panel widget, you can enable Show text to display text above or below the searchbar. Once selected, you’ll see options to add text, update the text color, and update the order.
2. In the Text field, you can add text to provide guidance or inspiration to your app users on what to search for. This text is static and will stay the same each time the user visits the home screen.
3. In Text color, you can select a color for the text by clicking on the dropdown menu. The available colors are based on your selected app colors in Style.
4. Update the Text order to determine if you would like the text to appear above or below your searchbar. You may also need to update the Search bar order.
5. Once you have updated the widget, click Save Changes at the bottom of the page.
6. Open your app to preview your Search Panel widget and to test that it works as expected.
Prompts
1. If you wish to add prompts to your Search Panel widget, you can enable Show prompts. Once selected, you’ll see options to update the text color, add a prompt, update the prompt period, and update the order.
2. In Text color, you can select a color for the prompt text by clicking on the dropdown menu. The available colors are based on your selected app colors in Style.
3. Click Add prompt to write a prompt that will be displayed to your users providing guidance and inspiration on what to search for next. To add more prompts, simply click on Add prompt each time.
4. In Prompts period you should add the number of seconds that you would like each of your prompts to appear for.
5. Update the Prompts order to determine if you would like the text to appear above or below your searchbar. You may also need to update the Search bar and Text order.
6. Once you have updated the widget, click Save Changes at the bottom of the page.
7. Open your app to preview your Search Panel widget and to test that it works as expected.