Price appear only when hover over for Highlight theme for desktop

Store Design
, ,

Topic summary

A user asked how to make product prices on collection pages appear only on hover (desktop view) for the Highlight theme, similar to the Maison Mayle website.

Solution Provided:

  • Open theme.liquid file in the theme editor
  • Add custom CSS code before the closing tag
  • The CSS targets product price elements to be hidden by default and visible on hover

Outcome:
The solution was confirmed to work perfectly by the original poster. The implementation requires basic theme code editing through Shopify’s Online Store > Theme > Edit code section.

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

Good Day,

Is it possible to only show up the price points (on all collections for desktop) only if you hover over the
product- like this site - Maison Mayle
https://maisonmayle.com/collections/dresses

Our current site: https://nishniche.com/ theme name Highlight.

Thanks in advance.

2

Hi @nasnas101 ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea for solution:

Step 1. Go to Online Store → Theme → Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before :

Hope my answer will help you.

Best regards,

Victor | PageFly

1 Like
3

Thank you so much Victor!

That worked perfectly!

1 Like