Jump to content

Making summary block entry title open lightbox instead of going to gallery page

Go to solution Solved by journeyrdu,

Recommended Posts

Site URL: https://www.journeyrdu.com/sermons

By default, when using the summary block to show items from a gallery page, the title portion of the text links to the gallery entry while the thumbnail itself can be linked to open the entry in the lightbox if enabled in the settings for the summary block.

For now, I've managed to disable the link from the title to the gallery entry by adding this to my page header:

<style>
.summary-title > a { pointer-events: none; cursor: default;}
</style>

Is there a way to make the title text open the lightbox for the entry when clicked, just like clicking on the thumbnail does?

Site is using Squarespace 7.0. There's multiple summary blocks on the page; I'd like the change to affect all of them.

Edited by alebcay
Remove redundant site URL (forum autoinserted at top of post)
Link to comment
  • Replies 1
  • Views 364
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

  • Solution

Rolled up my sleeves and learned JQuery. For future reference, my solution was to remove the custom styling from page header code injection and add the following:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  var $jq = jQuery.noConflict(true);
  $jq( document ).ready(function() {
    $jq( ".summary-title-link" ).removeAttr("href");
    $jq( ".summary-title-link" ).css('cursor', 'pointer');
    $jq( ".sqs-video-overlay" ).css('cursor', 'pointer');
    $jq( ".summary-title-link" ).click(function() {
      $jq(this).parent().parent().parent().find( ".summary-thumbnail-container" ).trigger("click");
    });
  });
</script>

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.