Announcement

Moving the search bar (on some pages)


Userlevel 7
Update May 13, 11:24: Changes are live

On May 13 (Monday) we'll move the position from the search bar from the 'navigation bar' to the 'hero panels' on the following pages:
  • Parent category
  • Category
  • Search result


For other pages the search bar will remain in the current place. We're making these changes to have a better alignment with the homepage and to make the search integrate better inside these pages. This is a heads up announcement in case you need to review your hero images for this upcoming change.

The changes are already in effect here on inSpired.

11 replies

Userlevel 3
Badge +3
Hi Yoeri,

Would it be possible to change the design of the search bar (color, shadow, line thickness, etc) ? As you can see, our headers are quite light/bright and I'm afraid the bar will not be that visible: https://forum.voo.be/bienvenue-sur-le-forum-14

Regards,
Tiou
Userlevel 5
Badge +1
Hi @Tiou,
Currently we don't offer customisation options for search bar design.
I quickly made a mockup of how your banner will look like in new design. The search bar is quite visible in my opinion. In case you would like to change the placeholder text color, you can find the setting in Control > Appearance > Colors > Placeholder color.



Cheers
Xiaoyu
Userlevel 4
Badge +1
Hi Yoeri,

thanks for the information. Would it be possible to deploy this on stage first, like a few days earlier, so that we can test how the new integration of the search bar looks like with the current hero images?

Regards,

Esther
Userlevel 3
Badge +3
@xiaoyu-shen that's cool, thanks for the testing mockup!
Userlevel 7
Badge +4
I second what @Esther Groth is asking! This would be very important to us, too, especially regarding mobile.

@Tiou You can use custom CSS to highlight the search bar in your community.
Userlevel 7
Thanks for the feedback, we'll deploy this change to your staging environment first (latest tomorrow). We'll let you know here once it's deployed to staging.
Userlevel 7
We deployed the changes to your staging environment 🙂
Hi @Yoeri thanks for the heads up!

We checked this in chaging. This feature cannot be activated as it provides an immediate UX logical problem:

Putting the search bar below the title and description of the page, suggests the search will be done within that category. This is not the case. We asked a few collegues of other departments how they would expect this feature to work. 1. They were expecting the search bar to be higher up the page. 2. They also expected the new search only finds items within that category.

We would like to hear your usertests findings that were the base of this decision 🙂
Userlevel 7
Hi,

We can understand that users think they will search the specific category. This is something we've planned for in the long term, in this topic you'll find some early concepts: https://community.insided.com/news-platform-updates-16/inside-design-advanced-search-1420
However we believe that with the right placeholder you can guide users in where they will be searching

The following findings made us want to move the position of the search bar:
  • Consistency with the homepage
  • Better visibility inside the (parent) category page. (We've heard users who prefer the search inside the hero image)
  • Some customers integrate their own header on our platform. Sometimes these headers have their own search bar as well, this lead to confusion to end users as there were 2 search inputs close to each other. Moving away the search bar to the hero image will make it already more distinct and easier to use in this use case
  • The plan to include search inside the category page someday
Hope this gives some insight in this change
Userlevel 7
Badge +4
However we believe that with the right placeholder you can guide users in where they will be searching
How can customers change the placeholder? We couldn't find a phrase.

I agree to @Anne's comments. The new position strongly suggests that a search within the category will be happening.
Userlevel 7
How can customers change the placeholder? We couldn't find a phrase.
Click the search bar (with the Phrases tool enabled) in the front-end to reveal and change the search placeholder.


We don't disagree with the comments made by Anne either. But we have our reasons to move the search bar 🙂

Reply