I want to achieve a similar affect to this image where only on desktop the prices and title appear in the middle of the product image when hovered and the image goes slightly white. I only want this to occur on desktop and stay the same as it is on mobile.
How can I achieve this,
Joe
my website is f22london.com and password is password123
Hi @f22london1 !!
I faced the same issue you are facing right now. For this you need to know the theme customization. But I do not have the knowledge of that earlier. So I came up with an silly idea which worked for me.
When you add product you can add an image which contains prices and title appear in the middle of the product. and tick “Show second image on hover”.
This method has many issues which will arise when changing the price, in your case it will also appear in mobile also.
Through it is not the solution but this will buy you some time.
Does this mean you can hide the price below, and the photo which comes on the listing
Hi @f22london1
We’ve carefully checked your problem and found that it’s quite complicated. So we suggest hiring a developer.
It’s what we can help with an optimal solution. If you need help from our expert, kindly share your request with us via Shopify experts: https://experts.shopify.com/bss-commerce/services?utm_source=Shopify+Community&utm_medium=Post+reply&utm_campaign=_
We will check it and give you a detailed solution. We’re looking forward to working with you.
fair - what are you rates
Hey @f22london1 ,
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.
Hi this works would this be possible to do with the triangles on my home page aswell ?
Hey @f22london1 ,
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.
Thankyou this worked perfectly, Is there a way I can make the the text in the centre of the triangles on desktop much larger so it is more visible but remain 10 px on desktop and aswell can the opacity of the triangles be much greater as to emulate the opacity on palaceskateboards.com
