Rich-text Reply

Make whole product div a hyperlink

elburnso 06-08-16
Accepted Solution

Make whole product div a hyperlink

Hi

 

I'm hoping you can help me. I'm trying to make the whole product space around a product a hyperlink. Currently its only the product image and product title that is hyperlinked. By hyperlinking the wole area i'm hoping to increase the conversion rate on mobile.

 

See link below to the category where I'm trying to implement this. I have tried amending the code Derry GAA Carron Half Zip Training Top but its putting an underline under the price and reward points text. Is there an easy way to hyperlink a whole div?

 

https://www.oneills.com/shop-by-team/gaa-county/derry-gaa.html?optimizely_x6045491565=1

 

Many Thanks

Declan

Website Manager
Level 4

CouchPsycho 06-09-16
 

Re: Make whole product div a hyperlink

 Yes,

 

an an onclick-event to the div but do not forget to adjust the cursor behaviour also. Since your items do not have any kind of id, as far as i can see, you will have to use optimizely to find a selector or add it to all items like this:

 

jQuery(".item").css({"cursor":"pointer"});

jQuery(".item").each(
   function(index)
   {
      var link = jQuery(this).find("a:eq(0)").attr("href");
      jQuery(this).click(function(){ window.location.href=link; });
   }
);

 

This should work :-)



"the essence of the creative act is to see the familiar as strange." (anonymous)
elburnso 06-09-16
 

Re: Make whole product div a hyperlink

Thank you, that worked a treat, Your a legend

 

Cheers

Website Manager
Level 4