Editing Search Page

Store Design
, , , , ,

Topic summary

A user is seeking help to customize their Shopify store’s search results page to match a reference design. The main customization requests include:

Initial Requirements:

  • Relocate “Search Results” text below the search bar and replace with “Results for ‘SEARCHED TERM’”
  • Remove “Filters” text and reposition “Availability” and “Price” sections vertically on the right with slide-in/out animations
  • Resize filter menus, remove underline from “Availability,” and eliminate hover effects

Current Status:
A support team member provided CSS code to hide field labels and adjust search input padding. However, the user reports no visible changes occurred.

Updated Requirements:
The user has simplified their request to focus on:

  1. Removing the “Search results” heading entirely
  2. Replacing small result count text with “Results for ‘edit’” (36px font, bold, center-aligned)

The discussion remains ongoing with the initial solution unsuccessful. The user has provided both their store URL and a reference store URL showing the desired appearance.

Summarized with AI on November 2. AI used: claude-sonnet-4-5-20250929.
1

Hi, I need help customizing my search page.
Here’s how my current search page looks:

CreatorTim_0-1735855293915.png
CreatorTim_0-1735855293915.png1920×830 78.7 KB

And here’s how I want it to look:

CreatorTim_1-1735855303362.png
CreatorTim_1-1735855303362.png1920×910 116 KB

Here’s what I need:

  1. Move the “Search Results” text below the search bar, and replace it with “Results for ‘SEARCHED TERM’.”
  2. Remove the “Filters” text, move the “Availability” and “Price” sections to the right and stack them vertically, and add a smooth slide-in and slide-out animation for them.
  3. Resize both the “Availability” and “Price” menus to make them smaller and remove the underline from “Availability.”
  4. Remove the hover effect for both “Availability” and “Price” menus, so the text doesn’t highlight when hovered over.

That’s everything I’d like.

Here’s my store URL: https://1049xn-ya.myshopify.com/search?options%5Bprefix%5D=last&q=edit

And here’s the reference store I want it to look like:
https://tomnoske.store/search?options%5Bprefix%5D=last&type=product%2Carticle%2Cpage&q=edit&sort_by=relevance

Thank you so much for your help. I really appreciate it!
Tim

2

Hi @CreatorTim

I hope you are well. You can follow our instructions below:

1/ Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
2/ From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
3/ Copy the code below and paste it there

Here is the code for Step 3:

label.field__label {
    display: none !important;
}
input#Search-In-Template {
    padding: 0.8rem 9.8rem 0.8rem 2rem !important;
}

image (5).png
image (5).png1281×624 73.9 KB

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

3

Hey, thanks for the feedback, but honestly, nothing has changed.

This is how it looks now:

CreatorTim_0-1735906046315.png
CreatorTim_0-1735906046315.png1920×818 74.2 KB

And this is more or less how I want it to look:

CreatorTim_1-1735906067404.png
CreatorTim_1-1735906067404.png1918×920 124 KB

So here’s what I need:

  1. Remove the “Search results” heading.
  2. Replace the small text “1 result found for ‘edit’” with “Results for ‘edit’,” increase the font size to 36px, bold it, and center-align it.

That’s all I want.

Here’s my store URL: https://1049xn-ya.myshopify.com/search?options%5Bprefix%5D=last&q=edit

And here’s the reference store I want it to look like:
https://tomnoske.store/search?options%5Bprefix%5D=last&type=product%2Carticle%2Cpage&q=edit&sort_by=…

Thanks a lot,
Tim