Taming Your Collection Pages: How to Remove Size Options on Shopify (Dawn Theme & Beyond)

Hey there, fellow store owners! Let's talk about something that often pops up in the Shopify community forums: those pesky size or variant options showing up on your collection pages when you really don't want them there. You know the drill – you've got a beautiful collection layout, but suddenly, underneath each product, there are 'S', 'M', 'L' buttons or color swatches cluttering things up. It's a common frustration, and I recently saw a great thread where our community members really dug in to help someone solve this very issue.

Our friend, coralseasw, from CoralSea Swimwear, posted a query titled "Remove the size from a page" because they were seeing these size options on their collection pages, even though they were using the Dawn theme. They shared a screenshot that looked something like this:

It's a classic case, and frankly, there are a few usual suspects when it comes to why these might appear. Let's break down the different ways our community suggested tackling it, from the simplest settings to a bit of code sleuthing.

First Stop: Your Theme Settings

Often, the easiest solution is found right within your theme's customization options. As rshrivastava63 pointed out in the thread, modern Shopify themes, especially Dawn, offer quite a bit of control without touching a single line of code. Here's what you should check first:

1. From your Shopify admin, go to Online Store > Themes.
2. Find your current theme (likely Dawn) and click Customize.
3. In the theme editor, navigate to a Collection template (you might need to select 'Collections' from the dropdown at the top of the editor, then choose 'Default collection' or the specific collection template you're using).
4. Look for sections related to product grids or product cards. Within these settings, you'll want to find options like:
• Show product options
• Show color swatches
• Enable quick add
5. If you see any of these enabled, try toggling them Off.

Coralseasw had already checked this and confirmed their 'Quick Add' was off, even sharing a screenshot of their settings:

This tells us that sometimes, the solution isn't quite as straightforward as a toggle. Also, a good point from Maximus3 was that newer versions of the Dawn theme often don't display size or color options on the product card by default. So, if your theme is a bit older, updating it might actually resolve the issue and bring a host of other benefits too!

When It's Hiding in Your Theme Code

If the theme settings don't do the trick, the next place to look is directly in your theme's Liquid code. rshrivastava63 provided some excellent guidance here, suggesting that the variant picker might have been added as a snippet to the product card. This is especially true if you've had customizations done or migrated from an older theme.

Editing Your Theme's Liquid Files

Before you do anything: Always, always, always duplicate your theme before making any code changes. This way, if something goes awry, you can easily revert to a working version.

Here's how to investigate and potentially remove the variant picker:

1. From your Shopify admin, go to Online Store > Themes.
2. Find your current theme and click Actions > Edit code.
3. In the code editor, look under the Snippets folder.
4. Open the file named card-product.liquid (or similar, depending on your theme's structure).
5. Search for lines of code that look like this:

{% render 'card-product-variant-picker', product: card_product %}

or

{% render 'product-variant-picker', product: card_product %}

6. If you find such a line, you can either delete it or, even better, comment it out. Commenting it out is safer as it allows you to easily reactivate it if needed. To comment it out, wrap it in {% comment %} and {% endcomment %} tags, like this:

{% comment %}
{% render 'card-product-variant-picker', product: card_product %}
{% endcomment %}

7. Save your changes.

The Unexpected Culprit: A Third-Party App

Now, this is where the community discussion took an interesting turn and ultimately led to coralseasw's solution! Dan-From-Ryviu, after asking for the store link (which coralseasw kindly shared: CoralSea Swimwear), quickly identified that the size swatches weren't coming from the default theme or custom Liquid code. Instead, they were being injected by a third-party app, specifically the "Globo app"!

This is a fantastic reminder that sometimes, features you're seeing aren't native to your theme but are added by an app you've installed, even if it's for something seemingly unrelated. Dan offered two great ways to tackle this:

Option 1: Disable within the App Dashboard

The cleanest way, if possible, is to go directly to the app's settings within your Shopify admin. For the Globo app (or whatever app might be causing the issue for you), look for options to disable variant swatches or product options on collection pages.

Option 2: Use Custom CSS to Hide It

If the app doesn't provide a direct toggle, or if you prefer a quick fix, you can always use custom CSS to hide the elements. Dan provided the exact CSS snippet that worked for coralseasw:

1. From your Shopify admin, go to Online Store > Themes.
2. Find your current theme and click Customize.
3. At the bottom left of the theme editor, click Theme settings (the gear icon).
4. Scroll down and click on Custom CSS.
5. Add the following code to the Custom CSS box:

.swatches-globo--list { display: none !important; }

6. Save your changes.

And just like that, coralseasw confirmed, "Thank you!! That works "! Success! This really highlights the power of the community and how specific insights can quickly solve a problem that might otherwise send you down a rabbit hole.

So, whether you're just starting your journey with Shopify or you're a seasoned pro looking to fine-tune your store, remember these steps. Always start with your theme settings, then delve into the code if necessary, and don't forget to consider third-party apps as potential sources of unexpected display elements. A little detective work, combined with the collective wisdom of the Shopify community, can save you a lot of headaches and keep your collection pages looking exactly how you envision them!