CLICKABLE COVER IMAGE

Hi, im trying for a long time to find a solution to this but I can't.

Im wondering how I can make a full screen photography in the COVER page clickable to direct to my website.

I don't want to use buttons. Simply click any part of the image in order to access to the web.

Thanks in advance!

Use a blank page, header and footer hidden,  with a full bleed image block as your landing page, give the image a clickable url to a more home like looking page on your site, that has a nav bar, 

Hi, 

I would like the cover page of my site www.delmialvarez.com clickcable without any action button. I was trying to follow your steps but i can´t get it.

My idea is have a clean cover image, with my logo on top and only the image should be linked when click over to a page. As you can see in the ttachemdn there is an ACTIOn buttonn called ENTER. I would like hide the button and just made the image clickcable in the whole space to a page.

Thank you for any idea, help or support.

Best

delmi

23 hours ago, delmi said:

Hi, 

I would like the cover page of my site www.delmialvarez.com clickcable without any action button. I was trying to follow your steps but i can´t get it.

My idea is have a clean cover image, with my logo on top and only the image should be linked when click over to a page. As you can see in the ttachemdn there is an ACTIOn buttonn called ENTER. I would like hide the button and just made the image clickcable in the whole space to a page.

Thank you for any idea, help or support.

 

Best

delmi

Add to Your Cover Page Header

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
	$('.sqs-slide-wrapper[data-slide-type="cover-page"] .sqs-slide').click(function() {
  window.location = $(this).find("ul li a").attr("href"); 
  return false;
});
});
</script>
<style>
  .sqs-slide-wrapper[data-slide-type="cover-page"] .sqs-slide {
    cursor: pointer;
}
  ul {opacity: 0 !important;}
</style>

5 hours ago, tuanphan said:

Add to Your Cover Page Header

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
	$('.sqs-slide-wrapper[data-slide-type="cover-page"] .sqs-slide').click(function() {
  window.location = $(this).find("ul li a").attr("href"); 
  return false;
});
});
</script>
<style>
  .sqs-slide-wrapper[data-slide-type="cover-page"] .sqs-slide {
    cursor: pointer;
}
  ul {opacity: 0 !important;}
</style>

 

Hi, thank you for your reply.

I can´t see how to do that in sqs. My plan is basic and I don´t have code injection.

Hi, thank you for your reply.

I can´t see how to do that in sqs. My plan is basic and I don´t have code injection.

On 6/23/2022 at 9:03 PM, delmi said:

Hi, thank you for your reply.

I can´t see how to do that in sqs. My plan is basic and I don´t have code injection.

See this new answer

https://forum.squarespace.com/topic/152750-how-to-add-clickthrough-url-to-custom-css-image/?do=findComment&comment=557884