Bugzilla – Attachment 189147 Details for
Bug 41199
Advanced Search fields could use more visible label options
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 41199: Add optional labels to search fields
Bug-41199-Add-optional-labels-to-search-fields.patch (text/plain), 24.73 KB, created by
Jake Deery
on 2025-11-06 08:47:33 UTC
(
hide
)
Description:
Bug 41199: Add optional labels to search fields
Filename:
MIME Type:
Creator:
Jake Deery
Created:
2025-11-06 08:47:33 UTC
Size:
24.73 KB
patch
obsolete
>From 31381e3e8cc8fb0b96bf07c225d431a073d891bf Mon Sep 17 00:00:00 2001 >From: Jake Deery <jake.deery@openfifth.co.uk> >Date: Thu, 9 Oct 2025 10:45:30 +0100 >Subject: [PATCH] Bug 41199: Add optional labels to search fields > >This patch adds the OPACShowLabelsForSearchInputs, which, when enabled, >will add numerous additional labels to the OPAC's advanced search and >masthead search regions. When disabled, this syspref will exhibit the >same behaviour we see now. > >== TO TEST == >a) visually look at the OPAC's mainpage, and advanced search page > *) notice the input fields lack visual labels >== APPLY PATCH == >b) repeat step a) > *) observe how nothing has visually changed >c) set the OPACShowLabelsForSearchInputs syspref to Show >d) repeat step a) again > *) notice how there are now visual labels associated with each of > the input fields >e) revert the OPACShowLabelsForSearchInputs syspref to Don't show >f) repeat step a) again > *) notice how there are again no visual labels >== SIGN OFF == >--- > .../bug_41199_add_labels_to_advsearch.pl | 17 +++++ > installer/data/mysql/mandatory/sysprefs.sql | 1 + > .../en/modules/admin/preferences/opac.pref | 8 +++ > .../bootstrap/css/src/_responsive.scss | 6 -- > .../opac-tmpl/bootstrap/css/src/opac.scss | 7 ++ > .../bootstrap/en/includes/masthead.inc | 68 ++++++++++++------- > .../bootstrap/en/modules/opac-advsearch.tt | 20 ++++-- > 7 files changed, 92 insertions(+), 35 deletions(-) > create mode 100755 installer/data/mysql/atomicupdate/bug_41199_add_labels_to_advsearch.pl > >diff --git a/installer/data/mysql/atomicupdate/bug_41199_add_labels_to_advsearch.pl b/installer/data/mysql/atomicupdate/bug_41199_add_labels_to_advsearch.pl >new file mode 100755 >index 00000000000..4d462b46f81 >--- /dev/null >+++ b/installer/data/mysql/atomicupdate/bug_41199_add_labels_to_advsearch.pl >@@ -0,0 +1,17 @@ >+use Modern::Perl; >+use Koha::Installer::Output qw(say_warning say_success say_info); >+ >+return { >+ bug_number => "41199", >+ description => "Add a way to enable/disable search input field labels", >+ up => sub { >+ my ($args) = @_; >+ my ( $dbh, $out ) = @$args{qw(dbh out)}; >+ >+ $dbh->do( >+ q{INSERT IGNORE INTO systempreferences (variable,value,options,explanation,type) VALUES ('OPACShowLabelsForSearchInputs','0',NULL,'If enabled, show labels beside each input field related to search inputs','YesNo')} >+ ); >+ >+ say_success( $out, "Added new system preference 'OPACShowLabelsForSearchInputs'" ); >+ }, >+}; >diff --git a/installer/data/mysql/mandatory/sysprefs.sql b/installer/data/mysql/mandatory/sysprefs.sql >index b47f27df977..975251b572f 100644 >--- a/installer/data/mysql/mandatory/sysprefs.sql >+++ b/installer/data/mysql/mandatory/sysprefs.sql >@@ -570,6 +570,7 @@ INSERT INTO systempreferences ( `variable`, `value`, `options`, `explanation`, ` > ('OPACShibOnly','0','','If ON enables shibboleth only authentication for the opac','YesNo'), > ('OPACShowCheckoutName','0','','Displays in the OPAC the name of patron who has checked out the material. WARNING: Most sites should leave this off. It is intended for corporate or special sites which need to track who has the item.','YesNo'), > ('OPACShowHoldQueueDetails','none','none|priority|holds|holds_priority','Show holds details in OPAC','Choice'), >+('OPACShowLabelsForSearchInputs', '0', NULL, 'If enabled, show labels beside each input field related to search inputs', 'YesNo'), > ('OPACShowLibraries', '1', '', 'If enabled, a link is shown in the OPAC pointing to a page with library information', 'YesNo'), > ('OPACShowMusicalInscripts','0','','Display musical inscripts on the OPAC record details page when available.','YesNo'), > ('OPACShowOpenURL', '0', NULL, 'Enable display of OpenURL links in OPAC search results and detail page', 'YesNo'), >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref >index 37202dc17c6..3bbaebc3645 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/admin/preferences/opac.pref >@@ -42,6 +42,14 @@ OPAC: > 0: Disable > - "Koha OPAC as public. Private OPAC requires authentication before accessing the OPAC. " > - 'Note: This does not affect the public API, see the <a href="/cgi-bin/koha/admin/preferences.pl?op=search&searchfield=RESTPublicAnonymousRequests">RESTPublicAnonymousRequests</a> to control the API.' >+ >+ - >+ - pref: OPACShowLabelsForSearchInputs >+ choices: >+ 1: "Show" >+ 0: "Don't show" >+ - "labels beside each of the search input fields." >+ > - > - pref: OPACShowLibraries > choices: >diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss >index 04a84b18938..819bae8c702 100644 >--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss >+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss >@@ -221,12 +221,6 @@ > > @media only screen and ( max-width: 700px ) { > /* Screens below 700 pixels wide */ >- #opac-main-search { >- label { >- display: none; >- } >- } >- > #logo { > background: transparent url( "data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 13 13'><g><g><path d='M2.2 6.6V13h2.83V8.9H8.2V13h2.83V6.6z'/><path d='M13.23 6.64H0L6.6 0z'/></g></g></svg>" ) no-repeat; > margin: 14px; >diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss >index d407c017594..ff4dd181c40 100644 >--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss >+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss >@@ -222,6 +222,13 @@ th { > #advsearches, > #booleansearch { > label { >+ color: #727272; >+ display: block; >+ font-size: 110%; >+ font-weight: bold; >+ } >+ >+ label[for^="search-field_"] { > display: inline; > } > } >diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc >index c136dfeb29a..201e5c962ac 100644 >--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc >+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc >@@ -17,6 +17,7 @@ > [% SET CookieConsentBar = AdditionalContents.get( location => "CookieConsentBar", lang => lang, library => branchcode || default_branch ) %] > [% SET CookieConsentPopup = AdditionalContents.get( location => "CookieConsentPopup", lang => lang, library => branchcode || default_branch ) %] > [% SET AllPublicBranches = Branches.all( search_params => { public => 1 }, selected => opac_name ) %] >+[% SET ShowLabelsForSearchInputs = Koha.Preference('OPACShowLabelsForSearchInputs') %] > > <button id="scrolltocontent">Skip to main content</button> > <!-- prettier-ignore-start --> >@@ -235,54 +236,58 @@ > <form name="searchform" method="get" action="/cgi-bin/koha/opac-search.pl" id="searchform"> > <div class="row gx-2"> > <div class="col-sm-auto order-2 order-sm-2"> >- <label for="masthead_search" class="visually-hidden">Search the catalog by:</label> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="masthead_search">Search catalog by:</label> >+ [% ELSE %] >+ <label for="masthead_search" class="visually-hidden">Search catalog by:</label> >+ [% END %] > <select name="idx" id="masthead_search" class="form-select"> > [% IF ( ms_kw ) %] >- <option selected="selected" value="" data-placeholder="[% t("Search the catalog by keyword") | html %]">Library catalog</option> >+ <option selected="selected" value="" data-placeholder="[% t("Search catalog by keyword") | html %]">Library catalog</option> > [% ELSE %] >- <option value="" data-placeholder="[% t("Search the catalog by keyword") | html %]">Library catalog</option> >+ <option value="" data-placeholder="[% t("Search catalog by keyword") | html %]">Library catalog</option> > [% END # /ms_kw %] > [% IF ( ms_ti ) %] >- <option selected="selected" value="ti" data-placeholder="[% t("Search the catalog by title") | html %]">Title</option> >+ <option selected="selected" value="ti" data-placeholder="[% t("Search catalog by title") | html %]">Title</option> > [% ELSE %] >- <option value="ti" data-placeholder="[% t("Search the catalog by title") | html %]">Title</option> >+ <option value="ti" data-placeholder="[% t("Search catalog by title") | html %]">Title</option> > [% END # /ms_ti %] > [% IF ( ms_au ) %] >- <option selected="selected" value="au" data-placeholder="[% t("Search the catalog by author") | html %]">Author</option> >+ <option selected="selected" value="au" data-placeholder="[% t("Search catalog by author") | html %]">Author</option> > [% ELSE %] >- <option value="au" data-placeholder="[% t("Search the catalog by author") | html %]">Author</option> >+ <option value="au" data-placeholder="[% t("Search catalog by author") | html %]">Author</option> > [% END # /ms_au %] > [% IF ( ms_su ) %] >- <option selected="selected" value="su" data-placeholder="[% t("Search the catalog by subject") | html %]">Subject</option> >+ <option selected="selected" value="su" data-placeholder="[% t("Search catalog by subject") | html %]">Subject</option> > [% ELSE %] >- <option value="su" data-placeholder="[% t("Search the catalog by subject") | html %]">Subject</option> >+ <option value="su" data-placeholder="[% t("Search catalog by subject") | html %]">Subject</option> > [% END # /ms_su %] > [% IF ( ms_nb ) %] >- <option selected="selected" value="nb" data-placeholder="[% t("Search the catalog by ISBN") | html %]">ISBN</option> >+ <option selected="selected" value="nb" data-placeholder="[% t("Search catalog by ISBN") | html %]">ISBN</option> > [% ELSE %] >- <option value="nb" data-placeholder="[% t("Search the catalog by ISBN") | html %]">ISBN</option> >+ <option value="nb" data-placeholder="[% t("Search catalog by ISBN") | html %]">ISBN</option> > [% END # /ms_nb %] > [% IF ( ms_ns ) %] >- <option selected="selected" value="ns" data-placeholder="[% t("Search the catalog by ISSN") | html %]">ISSN</option> >+ <option selected="selected" value="ns" data-placeholder="[% t("Search catalog by ISSN") | html %]">ISSN</option> > [% ELSE %] >- <option value="ns" data-placeholder="[% t("Search the catalog by ISSN") | html %]">ISSN</option> >+ <option value="ns" data-placeholder="[% t("Search catalog by ISSN") | html %]">ISSN</option> > [% END # /ms_ns %] > [% IF ( ms_se ) %] >- <option selected="selected" value="se" data-placeholder="[% t("Search the catalog by series") | html %]">Series</option> >+ <option selected="selected" value="se" data-placeholder="[% t("Search catalog by series") | html %]">Series</option> > [% ELSE %] >- <option value="se" data-placeholder="[% t("Search the catalog by series") | html %]">Series</option> >+ <option value="se" data-placeholder="[% t("Search catalog by series") | html %]">Series</option> > [% END # /ms_se %] > [% IF ( Koha.Preference('OPACNumbersPreferPhrase') ) %] > [% IF ( ms_callnumcommaphr ) %] >- <option selected="selected" value="callnum,phr" data-placeholder="[% t("Search the catalog by call number") | html %]">Call number</option> >+ <option selected="selected" value="callnum,phr" data-placeholder="[% t("Search catalog by call number") | html %]">Call number</option> > [% ELSE %] >- <option value="callnum,phr" data-placeholder="[% t("Search the catalog by call number") | html %]">Call number</option> >+ <option value="callnum,phr" data-placeholder="[% t("Search catalog by call number") | html %]">Call number</option> > [% END #/ms_callnumcommaphr %] > [% ELSE %] > [% IF ( ms_callnum ) %] >- <option selected="selected" value="callnum" data-placeholder="[% t("Search the catalog by call number") | html %]">Call number</option> >+ <option selected="selected" value="callnum" data-placeholder="[% t("Search catalog by call number") | html %]">Call number</option> > [% ELSE %] >- <option value="callnum" data-placeholder="[% t("Search the catalog by call number") | html %]">Call number</option> >+ <option value="callnum" data-placeholder="[% t("Search catalog by call number") | html %]">Call number</option> > [% END # /ms_callnum %] > [% END # /IF OPACNumbersPreferPhrase %] > </select> >@@ -291,7 +296,11 @@ > > <div class="col order-4 order-sm-3"> > [% IF ( !Koha.Preference( 'OpacAddMastheadLibraryPulldown' ) == 1 && mylibraryfirst ) %] >- <label for="translControl1" class="visually-hidden">Search the catalog by keyword in [% Branches.GetName( mylibraryfirst ) | html %]</label> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="translControl1" class="visually-hidden">Search catalog by keyword in [% Branches.GetName( mylibraryfirst ) | html %]:</label> >+ [% ELSE %] >+ <label for="translControl1" class="visually-hidden">Search catalog by keyword in [% Branches.GetName( mylibraryfirst ) | html %]:</label> >+ [% END %] > <input > type="text" > class="transl1 form-control form-control-filtered" >@@ -301,18 +310,27 @@ > data-bs-toggle="tooltip" > data-bs-placement="top" > title="Searching in [% Branches.GetName( mylibraryfirst ) | html %] only" >- placeholder="Search the catalog by keyword" >+ placeholder="Search catalog by keyword" > /><span id="translControl"></span> > [% ELSE %] >- <label for="translControl1" class="visually-hidden">Search the catalog by keyword</label> >- <input type="text" class="transl1 form-control" id="translControl1" name="q" value="[% ms_value | html %]" placeholder="Search the catalog by keyword" /><span id="translControl"></span> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="translControl1">Search catalog by term:</label> >+ [% ELSE %] >+ <label for="translControl1" class="visually-hidden">Search catalog by term:</label> >+ [% END %] >+ <input type="text" class="transl1 form-control" id="translControl1" name="q" value="[% ms_value | html %]" placeholder="Search catalog by keyword" /> >+ <span id="translControl"></span> > [% END # /ms_value %] > </div> > <!-- /.col --> > > [% IF ( Koha.Preference( 'OpacAddMastheadLibraryPulldown' ) == 1 && AllPublicBranches.size > 1 ) %] > <div class="col-sm col-md-3 col-lg-2 order-3 order-sm-4"> >- <label for="select_library" class="visually-hidden">Search the catalog in:</label> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="select_library">Search catalog in:</label> >+ [% ELSE %] >+ <label for="select_library" class="visually-hidden">Search catalog in:</label> >+ [% END %] > <select name="limit" id="select_library" class="form-select"> > <option value="">All libraries</option> > >@@ -364,7 +382,7 @@ > [% END # / opac_limit_override %] > [% END # / OpacAddMastheadLibraryPulldown %] > >- <div class="order-5 col-sm-auto"> >+ <div class="order-5 col-sm-auto align-content-end"> > <button type="submit" id="searchsubmit" class="btn btn-primary" title="Search" aria-label="Search"> > <i class="fa fa-search" aria-hidden="true"></i> > </button> >diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt >index 0cbe7c83903..9277d70f178 100644 >--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt >+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-advsearch.tt >@@ -33,6 +33,7 @@ > [% INCLUDE 'bodytag.inc' bodyid='advsearch' bodyclass='scrollto' %] > [% INCLUDE 'masthead.inc' %] > [% SET AllPublicBranches = Branches.all( selected => opac_name, search_params => { public => 1 } ) %] >+[% SET ShowLabelsForSearchInputs = Koha.Preference('OPACShowLabelsForSearchInputs') %] > > <form id="advsearch_form" action="/cgi-bin/koha/opac-search.pl" method="get"> > <input type="hidden" name="advsearch" value="1" /> >@@ -57,7 +58,10 @@ > <div class="search-term-row"> > <div class="search-term-input"> > [% IF ( expanded_options ) %] >- <select name="op" class="form-select"> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="op_[% loop.index | html %]">Combine with</label> >+ [% END %] >+ <select name="op" id="op_[% loop.index | html %]" class="form-select"> > <option value="AND" selected="selected">and</option> > <option value="OR">or</option> > <option value="NOT">not</option> >@@ -75,7 +79,10 @@ > <!-- .search-term-input --> > > <div class="search-term-input"> >- <select class="form-select" name="idx" aria-label="Choose search type for field [% loop.index + 1 | html %]" id="search-field_[% loop.index | html %]"> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="idx_[% loop.index | html %]">Search in</label> >+ [% END %] >+ <select class="form-select" name="idx" id="idx_[% loop.index | html %]" aria-label="Choose search type for field [% loop.index + 1 | html %]" id="search-field_[% loop.index | html %]"> > <option value="kw">Keyword</option> > [% IF ( expanded_options ) %] > <option value="kw,phr"> Keyword phrase</option> >@@ -131,11 +138,15 @@ > </div> > <!-- .search-term-input --> > <div class="search-term-input"> >- <input class="form-control" type="text" name="q" aria-label="Enter field [% loop.index + 1 | html %] search terms" value="" /> >+ [% IF ( ShowLabelsForSearchInputs ) %] >+ <label for="q_[% loop.index | html %]">Enter search here</label> >+ [% END %] >+ <input class="form-control" type="text" name="q" id="q_[% loop.index | html %]" aria-label="Enter field [% loop.index + 1 | html %] search terms" value="" /> > </div> > <!-- .search-term-input --> > [% IF ( expanded_options ) %] > <div class="search-term-input"> >+ <label> </label> > <a class="ButtonPlus" title="Add another field" href="#"> > <i class="fa fa-plus-square" aria-hidden="true"></i> > </a> >@@ -546,7 +557,8 @@ > $("#advsearches li:first a").tab("show"); > } > >- $('.search-term-row .search-term-input select[name="op"]').first().prop("disabled",true).hide(); >+ $('.search-term-row .search-term-input label[for^="op_"]').first().prop("disabled",true).hide(); >+ $('.search-term-row .search-term-input select#op_0').prop("disabled",true).hide(); > > [% IF ( ReturnToSearch ) %] > if (form_serialized = JSON.parse( Cookies.get("form_serialized") ) ) { >-- >2.50.1 (Apple Git-155)
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 41199
: 189147