How to remove or hide nav.breadcrub-container from Empire Theme site

Store Design
, , ,

Topic summary

A user seeks to remove or hide the breadcrumb navigation bar (nav.breadcrumb-container) from the top of search pages on their Shopify site using the Empire theme.

Proposed Solution:

Another user provides step-by-step CSS instructions:

  1. Navigate to: Shopify Admin → Online Store → Theme → Edit code
  2. Locate one of these files: base.css, theme.css, styles.css, custom.css, or theme.scss.liquid
  3. Add CSS code at the bottom of the file and save

Note: The actual CSS code snippet and visual reference image appear corrupted or encoded in the original posts, making the exact implementation unclear. The discussion includes a password-protected site link and appears to remain open pending clarification of the technical details.

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

https://vinylfoxusa.com/search?type=product&options[unavailable_products]=last&q=(id:7534773862479%20OR%20vfitz:3)&m=%7B%22make%22%3A%22Ford%22%2C%22year%22%3A%222018%22%2C%22model%22%3A%22F-150%20Raptor%22%2C%22sub_model%22%3A%22%22%2C%22engine%22%3A%22%22%2C%22path%22%3A%22%2F%22%2C%22domain%22%3A%22e61329-6c.myshopify.com%22%7D

Password: VINYL2024!

I would like to remove or hide the Breadcrumb navigation bar from the top of all search pages. Thank you in advance.

Breadcrumb Nav.png
Breadcrumb Nav.png3771×1795 377 KB

2

Hello @dtffox

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file base.css, theme.css, styles.css, custom.css or theme.scss.liquid
Step 3: Insert the below code at the bottom of the file → Save

See result

dws_pvt_ltd_0-1726664583782.png
dws_pvt_ltd_0-1726664583782.png1916×677 145 KB

Best Regards,
Dws_pvt_ltd