i’m looking to remove the contents also the 3 lines on the left side that i have hidden on the header home page without affecting the rest of the pages for mobile and desktop (please keep logo)
Topic summary
A user wants to remove header contents and the three-line menu icon (hamburger) from the homepage only, while keeping the logo and preserving the header on all other pages for both mobile and desktop.
Proposed Solutions:
Two community members offered similar CSS-based approaches:
- Method 1: Add conditional CSS to
theme.liquidusing{% if request.path == "/" %}to target the homepage specifically - Method 2: Use
{% if request.page_type == "index" %}instead, which also targets the homepage
Both solutions involve:
- Navigating to Online Store → Themes → Edit Code
- Opening the
theme.liquidfile - Inserting custom CSS code just before the
</head>tag
The CSS would hide specific header elements only when the homepage condition is met. One responder included a screenshot showing code placement. The discussion remains open with no confirmed resolution from the original poster.
Hi @undercoverfresh , you can follow these steps:
Step 1: Open Online Store → Themes → Edit code
Step 2: Find theme.liquid file
Step 3: Paste this code before close tag:
{% if request.path == "/" %}
{% endif %}
If this helpful, please let us know by giving us a like and marking it as a solution. Thanks
Hi @undercoverfresh ,
I have written custom code for this solution. Please follow below steps and let me know your feedback.
Follow these Steps:
-
Go to Online Store
-
Edit Code
-
Find theme.liquid file
-
Add the following code just above tag
{% if request.page_type == "index" %}
{% endif %}
If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!
Best Regards,
Makka
It very simple
