Hide/Reveal Price and Title on product cards

[sggallery]

Hello!

I’m currently using the spotlight theme and would like to make the title and price of products hidden until you hover over the image. Upon hovering, the title and price would show on top of the image.

I’ve tried other codes provided for similar questions but have not had any luck. (Also very new to shopify and not well-versed in backend code, so could be user error.)

Thanks!

[Dan-From-Ryviu]

Hi @sggallery

I’m Dan from Ryviu: Product Reviews Q&A.

You can do that by adding this code to your theme.liquid file, after in Online Store > Themes > Edit code

[sggallery]

Thank you so much!

I would like for the title and price to show up on the image, instead of underneath. Is this possible?

[PageFly-Theodor]

Hi @sggallery ,
This is Theodore from PageFly - Shopify Page Builder App.

To hide product titles and prices until hovering over the image in your Spotlight theme, follow these steps:

Go to Online Store > Themes > Actions > Edit code (Spotlight theme).
Open the product-card.liquid file in the Assets folder.
Add the provided CSS code and save your changes.

Best regards,
Theodore | PageFly

[sggallery]

Thanks for your response! A few questions below. (I’m very new to this all, clearly )

• Are you replying to my original question, or the follow up question on how to get the product title/price to reveal on top of the image instead of underneath?
• The CSS code you mention – did you mean to paste one in your reply, or are you referring to the code provided by Dan-From-Ryviu?
• Lastly, I’m not seeing the “product-card.liquid file” in the assets folder. Here’s what I’m seeing below: