Modify Sort Menu Option In Collection Page In Prestige Theme

[MRBB]

Hello everyone,

I am attempting to remove the following options from the sort menu on the Prestige theme:

• Price, low to high

• Price, high to low

• Date, old to new

• Date, new to old

Additionally, I would like to convert all the words on this menu to uppercase and decrease the font size.

Could you please guide me on how to achieve this using CSS?

My website is jupiter10.com however, these modifications are intended for an upgraded Shopify 2.0 version, which is not live yet.

Thank you very much,

Bruno

[Huptech-Web]

Hello @MRBB ,

You can use the below CSS to hide the option. Add it to the “collection-template.liquid” in the style tag or add it at the bottom in "theme.scss.liquid".

.Popover__Content {
  [data-value="price-ascending"],
  [data-value="price-descending"],
  [data-value="created-ascending"],
  [data-value="created-descending"] {
    display: none;
}

.Popover__Value {
    text-transform: uppercase;
    font-size: 11px;
  }
}

[MRBB]

Hi @Huptech-Web

Many thanks for your attention, but I can’t find “collection-template.liquid” in the style tag or add it at the bottom in “theme.css.liquid” on my code. Please see the attached images.

I have tried to paste it in theme.liquid and theme.css but I can’t see any results.

Please note this customization is for Shopify 2.0, which isn’t live yet. Does it change anything?

I would appreciate it if you could guide me further.

Many thanks again,

Bruno

[Huptech-Web]

Hello @MRBB ,

Can you provide me the preview link of the theme where you want to make those changes? Right-click on the preview and copy the link address it will create a preview link and provide the password if the store is password-protected.