Search Page

Overview

The Search Page in Label One theme provides a powerful, customizable search experience for your customers. It features a prominent search bar, quick search suggestions, and a flexible results display that can show products, articles, and pages. The search results are presented in a responsive grid layout similar to collection pages.

Key Features

• Prominent search input with customizable styling
• Predictive search capabilities
• Quick search term suggestions
• Filterable and sortable search results
• Responsive grid layout for results
• Support for product, article, and page results
• Pagination with "load more" functionality
• Compatible with product siblings/swatches feature

Search Form

The search form appears at the top of the page and includes:

• Large search input field
• Customizable search button
• Optional quick search terms for popular searches
• Predictive search dropdown (when enabled in theme settings)

Settings Guide

Page Title Settings

Setting	Description	Options
Title size	Controls the size of the search results title	XS to 7XL (responsive options available)
Title alignment	Sets the horizontal alignment of the title	Left, Center, Right

Filter Settings

Setting	Description	Options
Show product filter	Toggles the display of product filtering options	On/Off
Show sort filter	Toggles the display of sorting options	On/Off
Enable sticky positioning	Makes filters stick to the top when scrolling	On/Off
Filter alignment	Sets the horizontal alignment of filters	Left, Center, Right
Filter Groups Default State	Controls how filter groups initially appear	First Group Open, All Groups Open, No Groups Open

Inner Grid Spacing

Setting	Description	Options
Horizontal spacing	Controls the horizontal gap between results	0-100px
Vertical spacing	Controls the vertical gap between result cards	0-100px

Layout Settings

Setting	Description	Options
Number of columns	Sets the number of columns for desktop view	2-6
Number of columns on mobile	Sets the number of columns for mobile view	One column, Two columns
Products per page	Controls how many products display before pagination	4-48
Indent section	Adds indentation to the left and right edges	On/Off

Search Button Settings

Setting	Description	Options
Search button text size	Controls the size of the search button text	XS, S, Base, LG

Search Results Display

Setting	Description	Options
Show product results	Toggles the display of product results	On/Off
Show article results	Toggles the display of blog article results	On/Off
Show page results	Toggles the display of page results	On/Off
Message text size	Controls the size of message prompts	Small, Medium, Large, Extra Large

Quick Search Terms

You can add up to 5 quick search term blocks that appear below the search bar:

Setting	Description
Search term	The keyword or phrase to display as a clickable button

These quick search terms help customers discover popular products or categories with a single click.

Setup Instructions

Basic Setup

1. Navigate to your Shopify admin → Online Store → Themes
2. Click Customize on your current theme
3. Select the Search page template
4. Configure the main settings in the "Search Results" section

Adding Quick Search Terms

1. Click "Add block"
2. Select "Quick Search Term"
3. Enter a popular search keyword or phrase
4. Add up to 5 terms to showcase popular searches

Customizing Search Results

Configure Grid Layout:

• Set your desired number of columns (2-6 for desktop, 1-2 for mobile)
• Configure horizontal and vertical spacing between results
• Choose products per page (4-48)

Result Types:

• Enable/disable product results
• Enable/disable article results
• Enable/disable page results

Filter Settings:

• Enable/disable product filtering and sorting
• Set filter alignment and default state
• Toggle sticky positioning

Best Practices

Search Experience:

• Keep the search input prominent and easy to find
• Add 3-5 quick search terms for popular categories
• Use clear, descriptive language for quick search terms

Results Layout:

• Use 3-4 columns for optimal readability
• Maintain consistent spacing (10-20px recommended)
• Test layout on mobile, tablet, and desktop

Content Strategy:

• Enable all result types (products, articles, pages) for comprehensive search
• Ensure your products have descriptive titles and tags for better search results
• Consider showing fewer products per page (16-24) for faster loading

Filtering:

• Enable sorting to help users find most relevant results
• Consider setting "No Groups Open" for filter groups to save space
• Position filters according to your site's overall design pattern

Visual Consistency:

• Match search button text size with your site's button styling
• Align title and filter positioning with your collection pages
• Use consistent message text size for no-results states

Troubleshooting

• Predictive search not working: Verify predictive search is enabled in Theme Settings → Search
• Missing product results: Check that products are published and searchable
• Article/page results not appearing: Ensure you've enabled these result types in settings
• Filter options not showing: Verify your products have tags or other filterable attributes
• Mobile layout issues: Test on multiple devices and adjust column settings as needed

Integration with Other Features

The search page works seamlessly with other Label One theme features:

• Product Siblings: Color swatches will appear on product cards in search results
• Product Badges: Sale, sold-out, and other badges will display on product results
• Quick Add to Cart: When enabled, appears on product cards in search results
• Filtering System: Uses the same filtering system as collection pages

Technical Notes

• The search page uses AJAX pagination for a smoother browsing experience
• Predictive search results appear as you type, powered by Shopify's predictive search API
• Search results are loaded via Shopify's search functionality and can be filtered by type
• The layout adapts responsively to screen size, reorganizing columns for mobile devices

This documentation covers all aspects of the Label One theme's search page, helping you create an effective and user-friendly search experience for your customers.