Jump to content

How to add a link to List images?

Recommended Posts

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

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

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>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.