Shopify product images are unclickable

Question

I have a store https://firefits-com.myshopify.com and Fashe colorlib theme is installed.

Issue

The product name is clickable and redirects me to the product detail page but the images are unclickable and do nothing when i hove mouse to it.

What I want

I want the product images that clickable and redirect me to product page as the product name do.

I have searched a lot on Shopify forums, their e-commerce university and theme help but none of them help me.

We can't help you if you don't provide us with the code in question that has issues and if you don't show us what have you tried on our own in coding terms and not in search terms. — drip, Jul 19 '18 at 07:34
@drip basically i am new to shopify so i don't know in which section the actual code is placed. — discky, Jul 19 '18 at 07:52
Please read [Under what circumstances may I add “urgent” or other similar phrases to my question, in order to obtain faster answers?](//meta.stackoverflow.com/q/326569) - the summary is that this is not an ideal way to address volunteers, and is probably counterproductive to obtaining answers. Please refrain from adding this to your questions. — halfer, Jul 19 '18 at 12:12
If you are composing your questions on a mobile device, and this is discouraging you from using the Shift key, please use a PC or laptop to post questions. Additionally, we'd rather question authors used real English to the best of their ability, rather than constructions such as "bcoz" (to mean "because"). Questions are for posterity here, so we might as well make them readable. Thank you. — halfer, Jul 19 '18 at 12:14
@halfer i have never used "urgent" and i think there is nothing that violates the policy. i was waiting for the answer but you guys stuck me in something else. thanks — discky, Jul 21 '18 at 06:16
See [the revision history](https://stackoverflow.com/posts/51416041/revisions) to view your original version. — halfer, Jul 21 '18 at 06:56

bknights · Accepted Answer · 2018-07-19T18:55:52.640

0

Your CSS is making things difficult. The grey overlay is in front of the go to page link wrapping the image so the link is unclickable.

Adding something like this your assets/custom.css stylesheet starts to address the issue but you have a bunch more things to do so that the overlay functions the way you want it to.

.block2-img.wrap-pic-w {
    width: 100%;
    height: 0;
    padding-top: 133%;
}

.block2-img a {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: transparent;
    margin: 0;
}

edited Jul 19 '18 at 18:55

answered Jul 19 '18 at 18:49

bknights

14,408
2
18
31

now the image is click able but when i click the product suddenly added to cart , i want it to redirect me to product details page , could you explain what else i have to add ? – discky Jul 21 '18 at 18:13
That's because aside from the CSS there are also scripted behaviours to deal with. If this is outside of your comfort zone you could probably get quick help via Upwork – bknights Jul 21 '18 at 20:12

Shopify product images are unclickable

Issue

What I want

1 Answers1