Shopify Horizon Theme: The Bugs I See in Every Audit

The r/shopify Horizon threads have a tell. You can spot a Horizon store from the questions alone: "border still shows when I set it to 0," "every product URL has a variant ID appended," "burger menu freezes after I close it." Same shapes, different merchants, every week. I run a handful of Shopify Horizon theme audits each month, and the catalog of recurring bugs is now short enough that I can guess most of them before I open the store.

The header border that ignores your zero

Merchants set the header to a dark color, set the border thickness to 0, save, preview, and the line is still there. The same thing happens on a light header with the same setting. Resizing the browser between portrait and landscape views makes it disappear, then reappear. Refresh and it normalizes, then breaks on the next resize.

The Shopify Horizon theme stores this header height in a CSS variable called --top-row-height. The variable is set once when the page loads. There's a function in the theme JavaScript that should update it on a window resize event. It exists. It is never called. tim_1, a developer in the Shopify Community, traced this on April 20, 2026 and posted the one-line Custom CSS fix that everyone now copies:

#header-group { --top-row-height: var(--header-height); }

Paste it under Online Store > Themes > Customize > Theme settings > Custom CSS. The line goes away on both desktop and mobile.

If a thin line still appears when you scroll against a dark hero, the second half of the fix is this:

.header__row { background: #111; }

Replace #111 with your actual header color value. tim_1 confirmed this works on Horizon 3.5.1; I have applied both lines on five stores running 3.4 through 3.5.1 without a regression. The bug is acknowledged in two separate Shopify Community threads. The fix is not in the shipped theme.

The variant URLs that look fine but aren't

Click any product card on a collection page in the Shopify Horizon theme and the URL gains ?variant=12345, even for products that have one variant, or none. Two things flow from that, and only one of them is actually a bug.

The mostly-harmless part: the variant ID in the URL is paired with a <link rel="canonical"> pointing to the clean product URL. Google honors the canonical and indexes the clean version. CyrusBr asked tim_1 about this in April and got a clear answer. The canonical tag does its job. Indexing of updated descriptions can lag because crawl budget is split, but rankings are not destroyed.

The actually-bad part is the variant auto-selection. If the first variant in a product's option order is out of stock, the Horizon product page auto-selects it and renders Add to Cart as a grayed-out button. A merchant who has not checked their store on a logged-out browser since the last restock will not see this. A customer hitting the page sees what looks like a broken store.

I check the in-stock state of the first variant on every Horizon audit. Three of the last six stores had at least one product where the first listed option was out of stock and the page looked dead on arrival.

The community fix is to edit snippets/card-gallery.liquid and remove the variant ID from the constructed link. It solves the collection-page case but, as RedDrumSEO confirmed in September 2025, it pushes the same variant IDs into the recommended products section on the product page. The cleaner answer for most stores is two steps: reorder your variants so the typically-stocked option is first, and (if you regularly run out of the first option) wrap the variant rendering snippet to skip unavailable variants or label them "Sold Out" instead of disabling Add to Cart.

Mobile menus, foldable phones, and the 0.3px miss

The mobile hamburger has been broken in a specific way since November 2025. Tap to open: the menu drawer expands and the icon changes to an X. Tap the X to close: the icon flips back, the menu hides, and the next tap on the hamburger does nothing. vant3d reproduced it across Edge, Firefox, Chrome, Samsung Internet, and Safari on a Samsung Note 20 Ultra, Pixel, iPhone 14, and iPhone 15. The cause is the accordion toggle inside the menu drawer. Disabling that toggle in the Header section settings clears the freeze on every Horizon store I have tested.

The second mobile fault line is more specific and, if you don't carry a foldable phone, harder to notice. The Shopify Horizon theme uses @media screen and (max-width: 749px) to switch product pages into a single-column mobile layout. The Samsung Galaxy Fold 7 has an unfolded viewport of approximately 749.7px, exactly 0.3 pixels too wide to hit Horizon's breakpoint. The result: on Fold 7 in the unfolded state, product images vanish entirely on product pages. Confirmed on Shopify's own Horizon demo. Reported in January 2026. Four Horizon updates have shipped since without fixing it.

The Custom CSS patch is short and safe to apply across versions:

@media screen and (max-width: 750px) {
  .product-information__media { grid-column: 1 / -1 !important; }
}

If you have already disabled the menu accordion and the burger still freezes, that is usually the third pattern I find on Horizon audits, and the first 15 minutes with a help1 expert is free, usually enough time to identify which of the two CSS variants is biting you and apply the right patch.

What I tell merchants before they click Update

Horizon 3.5.0 landed in March 2026. Merchants who clicked the in-theme Update button were greeted with a wiped logo, no Color Scheme controls at all, and reset font settings. The Color tab showed: "No color schemes defined. Color schemes must be defined in settings_data and settings_schema files." Shopify support's response, confirmed across at least three independent reports, was: do not update. captaingrasseater on r/shopify went through the cycle three times on the same store with the same broken result.

This is not an isolated bad release. SeaAd4150 summarized the recent pattern in one line: 3.3 killed the menu, 3.4 removed the variant selector default for single-variant products, 3.5 broke the update path and brought the menu issues back. Every other major Horizon version has broken something that worked in the previous version. The new feature releases have been louder than the fix releases.

I used to tell merchants on smaller stores to take the in-theme Update button at face value. That was wrong, and I stopped about a year ago. What I tell them now is the same thing whether they are on 3.3 or 3.5:

1. Before clicking Update, duplicate your live theme from Online Store > Themes > the three-dot menu > Duplicate.
2. Click Update on the duplicate, not the live theme.
3. Preview the duplicate on a logged-out browser, on desktop and mobile.
4. Walk through every section of every page template you actually use. Color schemes, fonts, logo, menu, product page, cart.
5. Only publish if nothing is wrong. The live theme stays untouched as your rollback.

This is not Horizon-specific advice, but Horizon has made it mandatory. I wrote more about the workflow and what survives a Shopify Horizon theme upgrade in how to update a Shopify theme without losing your customizations on this blog last month; the duplicate-and-preview ritual applies to every Horizon version, not just 3.5.

Horizon is fine. Its release cadence is not. Until Shopify ships fix-only releases at the same pace as new sections, the duplicate-and-preview ritual is the only thing keeping merchant customizations safe across an update.