How to make a slideshow clickable in Brooklyn theme

New Member
8 0 0

Hello everyone!
I'm from Russia, so I apologize in advance for my mistakes.
Faced with such a problem, how to make a slideshow clickable on the Brooklyn theme without a button ?
I've read the whole forum, tried a bunch of options, but failed to do so.
Immediately write what articles tried
https://community.shopify.com/c/Shopify-Design/Making-Slideshow-images-clickable-Brooklyn/td-p/32599... - it did not help, I seem to have a completely different page code, not shown in the example
https://community.shopify.com/c/Shopify-Design/Making-hero-Slideshow-have-clickable-images-Brooklyn-... - everything worked here, but when you remove the button from the slideshow, and click on the picture in the slideshow, error 404 comes out.
In the end the answer was never found(

0 Likes

Hello @Abzalov,

Please share your site url so that I will give you exact solution

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
New Member
8 0 0

2 days ago I created a store and at the very start I faced this problem)
https://grandmakeup.myshopify.com/
Password: kraego

0 Likes

@Abzalov,

I checked your site...There is an error in console...

In which file you added the below code

<script> 
$(function(){ 
  $('.hero__slide') 
    .css('cursor', 'pointer') 
    .bind('click', function() { 
      window.location.href = $(this).data('url');
    }); 
}); 
</script>

2019-12-11_17-15.jpg

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
New Member
8 0 0

Sorry not strong in codes
You mean the whole code in theme.js.liquid?
At the beginning put </head>t and at the end < / head>tag?

0 Likes

Ok...you put your code in theme.js

 

Just change in your code..

$(document).ready(function() {
$(".hero-slideshow .hero__slide").click(function(){
	var slideURL = $(this).find(".hero__cta").attr("href");
        window.location.href = slideURL;
});
});

 Replace with this

$(document).ready(function() {
$(".hero-slideshow .hero__slide").click(function(){
	var slideURL = $(this).find(".hero__image").attr("href");
        window.location.href = slideURL;
});
});
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
New Member
8 0 0

Replaced the code as you said, but still throws a 404 error(

0 Likes

@Abzalov,

Did you put below code

$(document).ready(function() {
$(".hero-slideshow .hero__slide").click(function(){
	var slideURL = $(this).find(".hero__image").attr("href");
        window.location.href = slideURL;
});
});

 

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
New Member
8 0 0

Yes, now I will attach a screenshotRaBHgiqaV6k.jpg

0 Likes

Ok...

Can you please tell me which url are you passing for image click...

Can you please provide me screenshot of below section

2019-12-11_18-14.jpg

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes