How to Remove Product Title and Price on Shopify Using BemeApps

By Tony Ng.
February 26th, 2025

How to Remove Product Title and Price on Shopify Using BemeApps

Understanding the Problem: Why Remove Product Titles and Prices?

Shopify users often seek to customize their online stores to align with their branding and user experience goals. One common customization is removing product titles and prices from the Home and Shop All pages. This might be desirable for various reasons, such as creating a minimalist design, emphasizing product images, or offering a unique shopping experience.

The issue arises when users switch themes and find that the methods they used previously no longer apply. This is particularly the case when moving from the Origin theme to the Baseline theme. Each theme has its own structure and code, making it challenging to apply the same changes without guidance.

Why Does This Problem Occur?

The primary reason for this problem is the difference in how Shopify themes are structured. Themes are built using Liquid, Shopify's templating language, and each theme developer may organize their files differently. As a result, the code that controls product listings, including titles and prices, might be located in different files or have different class names.

Furthermore, some themes may have built-in options to hide these elements, while others require manual code adjustments. Understanding where and how to make these changes is crucial for achieving the desired outcome.

Step-by-Step Guide to Removing Product Titles and Prices

Step 1: Access Your Theme Code

Navigate to Your Shopify Admin Panel
- Log in to your Shopify account.
- Go to Online Store > Themes.
Edit Your Active Theme
- Find your active theme and click on Actions > Edit Code.

Step 2: Locate the Relevant Files

In the Baseline theme, you will need to identify the files that control product listings. These are commonly found in:

Sections/product-grid.liquid
Sections/featured-collection.liquid
Snippets/product-card.liquid
Snippets/product-price.liquid

Step 3: Modify the Code

Open the File
- Choose the file that corresponds to the page you want to edit (e.g., Home or Shop All).

Comment Out or Remove the Code

Search for the code that displays the product title and price. This typically looks like:

<h2 class="product-title">{{ product.title }}</h2>
<span class="product-price">{{ product.price | money }}</span>

Comment out these lines by wrapping them with Liquid comment tags:

{%- comment -%}
<h2 class="product-title">{{ product.title }}</h2>
<span class="product-price">{{ product.price | money }}</span>
{%- endcomment -%}

Alternatively, you can remove these lines entirely.

Step 4: Save and Review

Save Your Changes
- Click the Save button to apply your modifications.
Preview Your Store
- Go back to your Shopify store and refresh the page to ensure the changes have taken effect.

Troubleshooting Common Issues

Changes Not Reflecting: Clear your browser cache or try viewing your store in an incognito window.
Errors in Code: Ensure all Liquid tags are correctly closed and there are no syntax errors.

Conclusion

Customizing your Shopify store by removing product titles and prices can enhance your brand's aesthetic and user experience. By understanding the theme structure and making precise code adjustments, you can achieve the desired look for your online store.

For more tips and insights on optimizing your Shopify store, explore our related posts:

Author: BemeApps AI