Wexley: Is there a clickthrough workaround?

yulichka · April 4, 2015

Based on this Q&A: Why don’t clickthroughs work in Wexley? – I learned that in order to use clickthroughs, you have to create a page and then use elements that feed from a gallery, such as the Gallery Grid Block.

To maintain the nice grid/layout styling of the Wexley template, I tried the Summary Block Wall layout instead, which created a great mosaic grid with clickthroughs included.

The problem now is – it only loads 30 pieces from a gallery at a time. Does anyone have any experience loading more than 30 or of another workaround that would make all of this possible? Could it possibly be done with some kind of code injection?

Thanks in advance for your help!

Edited April 4, 2015 by yulichka
Extra square bracket

clayyount · April 4, 2015

There is a way to do it using the default gallery. It requires doing an ajax load on the gallery json to get the clickthrough urls and then some DOM manipulation to change the thumb click event. Put the code below in your page header code injection for the page with your gallery:

<script>
 var currentPageBaseURL=window.location.href.split("?")[0];
 Y.on("domready",function(e){
   Y.io(currentPageBaseURL+"?page=1&format=json-pretty", {
       on:{success: jsonLoaded}
   });
   function jsonLoaded(err,data){
   try{
     var jsonResponse = Y.JSON.parse(data.responseText);
     var items=jsonResponse.items
     Y.all("#thumbList .thumb, #galleryWrapper .slide").each(function(e){
       var thumbId=this.getAttribute("data-slide-id");
       for(var i=0;i<items.length;i++){
         if(thumbId==items[i].id && items[i].clickthroughUrl){
           this.setAttribute("data-clickthrough-url",items[i].clickthroughUrl).on("click",function(e){
             e.preventDefault();
             e.stopPropagation();
             window.open(this.getAttribute("data-clickthrough-url"),'_blank');
           })
         }
       }
     })
     }catch(e){}
   }
 });
</script>

EDIT: updated it to work on mobile too.

Edited May 8, 2015 by ghostcat

fluxuscat · April 28, 2015

Hi @ghostcat, could you explain this more? I pasted it but it doesn’t work.

Edited April 28, 2015 by fluxuscat

clayyount · April 29, 2015

can you post a link to your site?

May 4, 2015

Hi Ghostcat,I entered your code above and seems to work but opens the linked page in a new window. Is there a way to change the code to so that it transitions in the same window? This would solve the issue for me completely. Cheers

clayyount · May 4, 2015

Use the code, but change:

window.open(this.getAttribute("data-clickthrough-url"),'_blank');

to

window.open(this.getAttribute("data-clickthrough-url"),'_self');

May 4, 2015

Thank you so much! That works perfectly. Much appreciated.

danastasion · July 10, 2015

I also had a problem with Wexley's inability to use click-throughs. Another thread recommended using the Gallery Grid Block to replace the Wexley gallery on the homepage. When I did this, the click-throughs worked, but unfortunately, the new gallery images didn't flexibly realign the way the Wexley homepage did and I wanted to keep that effect. I don't have any experience with coding, so I was reluctant to make the changes in the above post.

I ended up hiring a programmer endorsed by Squarespace to make the tweaks for me. His name is Brad Good and he made the changes in half an hour tops. It was cheap too.

Now the click-throughs work perfectly with the Wexley homepage template. If you're in my position, I highly recommend seeking out his help!

Here's his info: http://specialists.squarespace.com/specialist/brad-good

Edited July 10, 2015 by danastasion

LG1118 · July 20, 2015

Thank you! Do I only have to change the "currentPageURL"?My gallery page's url-slug is /product. So would the code look like this: var /product=window.location.href.split("?")[0]; ?

Is there anything else that needs to change? Thanks!!

danielw · February 5, 2016

@ghostcat I'm getting a error with this code. Possibly syntax error.

Missing opening {

Do you know what might fix this?

mirellalla · February 9, 2016

Hey guys,

I tried your code @ghostcat and it works, but only on the first image of the gallery! Did anyone else have that problem and then managed to solve it?

Thanks!

mirellalla · February 9, 2016

Hey guys,

I tried your code @ghostcat and it works, but only on the first image of the gallery! Did anyone else have that problem and then managed to solve it?

Thanks!

uniqueb · March 28, 2016

HI @ghostcat, i tried using your code it worked for the first 2 image of the gallery, but not working for the rest, any idea what went wrong? thanks

michaeljpitts · May 26, 2016

Thank you!!!! @ghostcat

July 22, 2016

i have contacted the same specialist! hoping he will be able to help me out too :) do you think i could see your website to see how the clickthrough urls work? thanks!

ulrikalindell · October 5, 2016

hi @ghostcat -- thank you for the script! I am in a similar situation as a few others here, where your script works beautifully, but only for the first image in the gallery. any idea why this might be, or if there is a quick fix to this problem? or did someone else figure out how to do this? I'd appreciate any help. thanks!

October 23, 2016

@ulrikalindell Did you ever figure this problem out? The script works but only for the first image! Please help!

adriand · January 31, 2017

I just wanted to let you know that the answer for this question worked a treat, Ghostcat. You are an absolute credit to humanity. :)

adriand · February 1, 2017

I was having this same issue. Then I tried it in another browser and it was working. So, I cleared my history in Chrome (my native browser), and it started working fine again. It isn't ideal, but I suggest giving that a go.

rthurston · February 27, 2017

This is awesome. I have imported the code and can add an URL but from there can't see how it works? How do I direct people to an option to actually click through from the image?

richardstow · March 31, 2017

Thank you for this bit of code!! I wish I had found it sooner - it's now saving me so much time and building pages and adding individual images with click throughs!

For everyone else - while it 'appears' not to be working, you need to clear your history, then it seems to work perfectly.

Seafox89 · April 4, 2017

YOU ARE A BEAUTIFUL PERSON. Thank you!! A wonderful piece of code.Had to clear my Chrome cache for it to work on images other than the first.

sixgreenshoes · November 30, 2017

Hi @ghostcat, Thanks for this code, I just tried to use it but it came back with a message that said: missing opening `{

Do I need to add a { somewhere into the code?

bradgood · January 25, 2019

I wrote up a tutorial on my site, I can't believe this has not fixed. I doesn't have any negative effects on the template. Previously, I was enabling Developer Mode and fixing the template, but I figured out the issue to the "Best Answer" below.

https://www.bradgood.net/articles/enable-clickthrough-url-on-squarespace-wexley-template

bradgood · March 29, 2019

Squarespace killed the Specialist directory... you can find me at https://www.bradgood.net/

Wexley: Is there a clickthrough workaround?

Recommended Posts

Link to comment

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

bradgood

Link to comment

Link to comment

Link to comment

Guest

Link to comment

Link to comment

Guest

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Guest

Link to comment

Link to comment

Guest

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Link to comment

Create an account or sign in to comment

News

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources