Search - ucsf-ckm/ucsf-library-ux-and-web-documentation GitHub Wiki

In late July 2021, we began using Primo as part of a UC-wide rollout. The UCSF catalog and the UC catalog (Melvyl) will be replaced by the new UC Library Search. The old UC-links link resolver will also be replaced. Full details at Search Primo VE.

• There is a link to site search in the main navigation menu
• It opens a separate page
• The search form is dropped in as an Elementor widget, but it is a standard part of WordPress and is driven by a theme template that can be customized in Elementor (through the search functionality cannot be influenced). See Elementor > Templates > Theme Builder > Search Results

Users don't realize (nor should they have to) that the Help Center is a separate platform with separate search. The results from the site search will display in two columns, one drawn from library.ucsf.edu and one drawn from the Zendesk Help Center.

In order to flow results from the Zendesk Help Center into the same results page. Stefan wrote a custom plugin UCSF Library Website Elementor addons and zip file for installation into WordPress. Once installed, it adds a new Zendesk search item to the list of available elementor widgets. That widget is then used in the template Elementor > Templates > Theme Builder > Search Results.

A css class help-center-results is also added along with some styling in the custom css sheet

• Zach has documented two ways to make LibGuides discoverable in UC Library Search in the UCSF Library Alma & Primo VE wiki space
• TBD whether there's a good way to include LibGuides results in site search

Make search options and the results even more consolidated and intuitive for the user. Still TBD.

On the home page, the primary search is for library materials and gets passed through to the discovery layer. We'd like to make this a dual search area instead, with one input for Primo VE search and the other for Services and Support. This is the rough concept, but it won't be fully developed until after UC Library search launches.

• We wanted the standard WordPress search form to remain and give results for any/all pages and posts
• We wanted another WordPress search form on /news that will only give results for posts. This cannot be done easily except by using a child theme and creating a second search template.

How is the search form generated in WordPress? By a theme template, in our case:

GeneratePress: Search Form (searchform.php)

<?php
/**
 * The template for displaying search forms in Generate
 *
 * @package GeneratePress
 */

if ( ! defined( 'ABSPATH' ) ) {
	
exit; // Exit if accessed directly.
}
?>
<form method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
	
<label>
		
<span class="screen-reader-text"><?php echo apply_filters( 'generate_search_label', _x( 'Search for:', 'label', 'generatepress' ) ); // WPCS: XSS ok, sanitization ok. ?></span>
		
<input type="search" class="search-field" placeholder="<?php echo esc_attr( apply_filters( 'generate_search_placeholder', _x( 'Search &hellip;', 'placeholder', 'generatepress' ) ) ); // WPCS: XSS ok, sanitization ok. ?>" value="<?php echo esc_attr( get_search_query() ); ?>" name="s" title="<?php echo esc_attr( apply_filters( 'generate_search_label', _x( 'Search for:', 'label', 'generatepress' ) ) ); // WPCS: XSS ok, sanitization ok. ?>">
	
</label>
	
<input type="submit" class="search-submit" value="<?php echo apply_filters( 'generate_search_button', _x( 'Search', 'submit button', 'generatepress' ) ); // WPCS: XSS ok, sanitization ok. ?>">
</form>

In this case, Rich instead wrote some JS that made it work in a "good enough" way. It's saved in Appearance > Elements > Legacy Hooks > After Footer Content

<?php
global $wp;
if($wp->request === 'news') :
?>
<!-- Restrict news sidebar search box to search only news. -->
<script>
  var searchBox = document.getElementById('news-search').querySelector('form');
  if (searchBox) {
    var hidden = document.createElement('input');
    hidden.setAttribute('type', 'hidden');
    hidden.setAttribute('name', 'post_type[]');
    hidden.setAttribute('value', 'post');
    searchBox.appendChild(hidden);
  }
</script>
<?php endif; ?>

<?php if (is_search()): ?>
<!-- Change header on search results page if searching news -->
<script>
if (window.location.search.indexOf('&post_type%5B%5D=post') !== -1) {
  var header = document.querySelector('h1');
  if (header) {
    header.prepend('News ');
  }
}
</script>
<?php endif; ?>