Hi Pablo or other, hope you have a good start in 2022
I think I have seen how to do this before... but can not find the post. I know how to make full page links to the different slides in a carousel, but what I''m now trying to do is:
Having a slideshow on one page where the different slides shall link to corresponding slide on a different page in the same project. See this page where I have the first slide linked:
https://www.chevere.ec/archivoblomberg/tienda.html
Link to a specific slide in carousel on different page?
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/links.html
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/links.html
Re: Link to a specific slide in carousel on different page?
I'm sorry, there is no option for this.
Re: Link to a specific slide in carousel on different page?
Ok, tnx for rapid answer on a sunday
Was looking for an extension (photo library or slider) that would do the same... but didn't find. Maybe you or someone else know about an extension that do the same as my example?
Otherwise I do the hard way... making a separate page for each slide...
Re: Link to a specific slide in carousel on different page?
Better late than never. I have a couple of hacks for this which work with the Bootstrap Carousel and the Slideshow:
For both the Bootstrap Carousel and Slideshow on the page you want to link from:
Link each image to External Web address and enter the page id and slide number in this format
----------------------------------------------------------------------------------------------------------------------------------------------------
On the page you are linking to for the Bootstrap Carousel insert two html frames:
Frame 1 with setting "Beween <head></head> tags" enter the following
Note that each slide has it's own if block. Add/remove blocks as required and adjust numbering sequence.
Frame 2 with setting "After <body> tag" enter the following anchors:
Note that slides start at 0 (zero) which is the first slide. Change slider_10 to your slider id but do not remove the #
--------------------------------------------------------------------------------------------------------------------------------------------------
On the page you are linking to for the Slideshow we're triggering the pagination to index the slides.
Use one html frame with setting "Between <head></head> tags" and enter
Note that pagination id's are numbers begining with 1 (#1) which is the first slide. Each slide has it's own if block. Add/remove blocks as required and adjust numbering sequence.
Demo here https://linkcarousel.discoverproductivity.co.uk/
Hope this helps
Joe
For both the Bootstrap Carousel and Slideshow on the page you want to link from:
Link each image to External Web address and enter the page id and slide number in this format
Code: Select all
page2.html#s1
On the page you are linking to for the Bootstrap Carousel insert two html frames:
Frame 1 with setting "Beween <head></head> tags" enter the following
Code: Select all
<script>
$(document).ready(function(){
if(window.location.hash == '#s1'){
$("#s1").trigger("click");
}
if(window.location.hash == '#s2'){
$("#s2").trigger("click");
}
if(window.location.hash == '#s3'){
$("#s3").trigger("click");
}
if(window.location.hash == '#s4'){
$("#s4").trigger("click");
}
});
</script>
Frame 2 with setting "After <body> tag" enter the following anchors:
Code: Select all
<a href="#" id="s1" data-target="#slider_10" data-slide-to="0"></a>
<a href="#" id="s2" data-target="#slider_10" data-slide-to="1"></a>
<a href="#" id="s3" data-target="#slider_10" data-slide-to="2"></a>
<a href="#" id="s4" data-target="#slider_10" data-slide-to="3"></a>
--------------------------------------------------------------------------------------------------------------------------------------------------
On the page you are linking to for the Slideshow we're triggering the pagination to index the slides.
Use one html frame with setting "Between <head></head> tags" and enter
Code: Select all
script>
$(document).ready(function(){
if(window.location.hash == '#s1'){
$("#1").trigger("click");
}
if(window.location.hash == '#s2'){
$("#2").trigger("click");
}
if(window.location.hash == '#s3'){
$("#3").trigger("click");
}
if(window.location.hash == '#s4'){
$("#4").trigger("click");
}
});
</script>
Demo here https://linkcarousel.discoverproductivity.co.uk/
Hope this helps
Joe
If it wasn't for bad luck, I'd have no luck at all.