How to add a link to List images?

Site URL: https://coconut-dolphin-d2rs.squarespace.com/events-list

Hello,

Is it possible to add links to the images in a List section? I need the image links to be different than the button links. The button links will direct users to an outside website to purchase tickets and the images should link to internal pages with event details.

Here is a sample page: https://coconut-dolphin-d2rs.squarespace.com/events-list

PW: torch

Thank you,

Jeff

On 10/13/2021 at 8:10 AM, jeffratto said:

Site URL: https://coconut-dolphin-d2rs.squarespace.com/events-list

Hello,

Is it possible to add links to the images in a List section? I need the image links to be different than the button links. The button links will direct users to an outside website to purchase tickets and the images should link to internal pages with event details.

Here is a sample page: https://coconut-dolphin-d2rs.squarespace.com/events-list

PW: torch

Thank you,

Jeff

Hi,

Try adding this to Settings > Advanced > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function() { 
  // event list item 1
		$('.user-items-list-item-container[data-section-id="61662d443e83113823cbf234"] li:nth-child(1) .list-item-media').click(function() {
			var link = $(this).text(),
				href = "https://google.com";
			window.location.href=href;
		});
    // event list item 2
		$('.user-items-list-item-container[data-section-id="61662d443e83113823cbf234"] li:nth-child(2) .list-item-media').click(function() {
			var link = $(this).text(),
				href = "https://instagram.com";
			window.location.href=href;
		});
    // event list item 3
		$('.user-items-list-item-container[data-section-id="61662d443e83113823cbf234"] li:nth-child(3) .list-item-media').click(function() {
			var link = $(this).text(),
				href = "https://facebook.com";
			window.location.href=href;
		});
});
</script>