How can I shift the vertical filter menu to the right in Dawn Theme?

Store Design
,

Topic summary

A user seeks to relocate the vertical filter menu from the left to the right side of collection pages in Shopify’s Dawn Theme.

Two solutions were provided:

  1. CSS injection via theme.liquid: Add custom CSS below the <head> tag in theme.liquid to reposition the filter menu (includes reference screenshot).

  2. Direct CSS file modification: Edit component-facets.css around line 1035, changing the .facets-vertical media query by removing or replacing flex-direction: row-reverse; with display: flex; to achieve right-side positioning.

Outcome: The original poster confirmed the solution worked successfully.

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

Hello fellow Shopifiers…

Is there a way to move the vertical filter menu to the right side of collection, I’m using Dawn Theme.

Cheers Lars

Screenshot 2024-04-24 at 11.09.22.png
Screenshot 2024-04-24 at 11.09.22.png1444×1222 187 KB

2

Hey @larsvilhelmsson ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1713952125579.png
ThePrimeWeb_0-1713952125579.png2162×1609 276 KB

3

Hi Larsvilhelmsson,
To Shift Filter to the right you need to

  1. Go to “Edit Code”

  2. Search for “component-facets.css”

  3. Go to around line 1035 there will be this code

@media screen and (min-width: 750px) {
  .facets-vertical {
    display: flex;
  }
  1. Change or replace this code with
@media screen and (min-width: 750px) {
  .facets-vertical {
    display: flex;
    flex-direction: row-reverse;
  }

Thats all
Hope you find this solution helpful

4

Cheers! Worked wonders! Tack, Thanks and Merci!