? ?
avatar frogydiak
frogydiak
21 Sep 2018

What needs to be fixed

Is there any reason why the search box in layout joomla.searchtools.default is aligned right? Is this something that is standard in UK or Europe?

joomla4_search_alignedright

Why this should be fixed

Since we read from Left to right, having an empty space in the left looks awkward compared to this:

joomla4_searchtool_left_aligned

Side Effects expected

In com_menu, the way joomla.searchtools.default was coded, it will break the layout when showing custom filter field but I think it can easily be fixed with the Filter dropdown Button on its own line of code and not in the same layout with the search box.

Here's a mock up of filters in one place:
joomla4_with_customfilter

avatar frogydiak frogydiak - open - 21 Sep 2018
avatar joomla-cms-bot joomla-cms-bot - change - 21 Sep 2018
Labels Added: ?
avatar joomla-cms-bot joomla-cms-bot - labeled - 21 Sep 2018
avatar brianteeman
brianteeman - comment - 21 Sep 2018

Nothing to do with uk or europe

Read https://uxmag.com/articles/usability-tip-dont-make-me-search-for-search

Or the book don't make me think

avatar brianteeman brianteeman - change - 21 Sep 2018
Labels Added: J4 Issue
avatar brianteeman brianteeman - labeled - 21 Sep 2018
avatar frogydiak
frogydiak - comment - 22 Sep 2018

@brianteeman In a site header, I agree that search is usually found on the right side but searchtools search box is a toolbar (not a page header). Based on the URL you provided above:

usability-tips-dont-make-me-search-meetup

Notice the toolbar in the middle with a gray background, the placement of search box is on the left side and buttons on the right. It creates a balance in UI. Take a look at the current layout of searchtools where the searchbox is in the right.

joomla4_search_alignedright

I don't know, it just feels like something is missing in the UI.

avatar brianteeman
brianteeman - comment - 22 Sep 2018

I am not a designer. I just took the time to reply to you.

avatar franz-wohlkoenig franz-wohlkoenig - change - 22 Sep 2018
Status New Discussion
avatar franz-wohlkoenig franz-wohlkoenig - change - 22 Sep 2018
Category Templates (admin) UI/UX
avatar ciar4n
ciar4n - comment - 22 Sep 2018

Having used J4 for some time, I did find myself missing the filters/search at the top left of the table. I think it was a mistake moving them to the top right and hiding them behind a dropdown (my own doing).

avatar brianteeman
brianteeman - comment - 22 Sep 2018

I've been using it for a long time now as well. The filters were always behind a dropdown so I dont mind it here and I never use the sort dropdowns I just click on the column headers (which will be more obvious when my pr is merged)

As for the position of the search box - I really dont mind it - I think its just a case of muscle memory and I am far more used to looking for a search box on the right hand side as thats a far more common design

avatar brianteeman
brianteeman - comment - 22 Sep 2018

I do note however that the design proposed by @coolcat-creations calls for the dropdown to be split into two again and for the action buttons to be on the same row

screeshot of proposed screen

avatar ciar4n
ciar4n - comment - 22 Sep 2018

hiding them behind a dropdown

What I meant really is away from the J3 searchtools, which I believe was fashioned on Google (search for something -> click 'Tools') and changing them to the more traditional dropdown. But as you say, this is maybe just muscle memory on my part (I use searchtools a lot).

avatar brianteeman
brianteeman - comment - 22 Sep 2018

yes it was modelled on google

avatar frogydiak
frogydiak - comment - 22 Sep 2018

If the toolbar should be moved into one bar (like in the screenshot above) then I guess it would make more sense for the search box to be aligned right. @ciar4n is right, I guess I use searchtools a lot also in J3 and it is a muscle memory for me to look for searchbox on the left side but J4 placement is on the right and blank space on the left of the bar... in most views.

avatar ggppdk
ggppdk - comment - 22 Sep 2018

Also in smaller screens can the text of buttons

'Filtering options'
'List options'

be auto-hidden ? leaving only the icons ?

avatar coolcat-creations
coolcat-creations - comment - 2 Mar 2019

I do note however that the design proposed by @coolcat-creations calls for the dropdown to be split into two again and for the action buttons to be on the same row

screeshot of proposed screen

It's not intended to be split, I described it in the JCM Article that it's intended to have options to display certain columns or not. It does not have to have such a big button but every user has different data which is important for them, so the backend gets more overview if the user is able to customize the table columns. For example rating is maybe not important to some editors but rather the language. For some others the autor and the title is very important but the creation date does not matter at all. It's about decluttering the backend for everyones own needs. See screen: https://coolcat-creations.com/joomla/#/screens/266934595 The most reasonable position for this settings would be probably a cog icon next to the table colums instead of the seperate button I proposed, since the settings are not changed regulary and don't need that much attention.

avatar franz-wohlkoenig
franz-wohlkoenig - comment - 2 Apr 2019

Please add Label "J4 Backend Template".

avatar infograf768 infograf768 - change - 2 Apr 2019
Labels Added: ?
Removed: J4 Issue
avatar infograf768 infograf768 - labeled - 2 Apr 2019
avatar infograf768 infograf768 - unlabeled - 2 Apr 2019
avatar franz-wohlkoenig franz-wohlkoenig - change - 5 Apr 2019
Labels Added: J4 Issue
avatar franz-wohlkoenig franz-wohlkoenig - labeled - 5 Apr 2019
avatar franz-wohlkoenig franz-wohlkoenig - change - 5 Apr 2019
Title
[4.0] Search Toolbar Aligned Right
[4.0] [Backend Template] Search Toolbar Aligned Right
avatar franz-wohlkoenig franz-wohlkoenig - edited - 5 Apr 2019
avatar franz-wohlkoenig franz-wohlkoenig - change - 19 Apr 2019
Title
[4.0] [Backend Template] Search Toolbar Aligned Right
[4.0] Search Toolbar Aligned Right
avatar franz-wohlkoenig franz-wohlkoenig - edited - 19 Apr 2019
avatar franz-wohlkoenig franz-wohlkoenig - change - 20 Apr 2019
Labels Removed: J4 Issue
avatar franz-wohlkoenig franz-wohlkoenig - unlabeled - 20 Apr 2019
avatar alikon
alikon - comment - 29 Aug 2019

related to the old template, open a new issue if needed


This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/22314.

avatar joomla-cms-bot joomla-cms-bot - change - 29 Aug 2019
Status Discussion Closed
Closed_Date 0000-00-00 00:00:00 2019-08-29 15:05:11
Closed_By joomla-cms-bot
avatar joomla-cms-bot joomla-cms-bot - close - 29 Aug 2019
avatar alikon alikon - change - 29 Aug 2019
Closed_By joomla-cms-bot alikon
avatar joomla-cms-bot
joomla-cms-bot - comment - 29 Aug 2019

Set to "closed" on behalf of @alikon by The JTracker Application at issues.joomla.org/joomla-cms/22314

Add a Comment

Login with GitHub to post a comment