Thanks @James
I am not a programmer and I don’t really understand how this can be done.
The main problem for me is how to get an array of image URLs from the gallery field (it is part of a Options page) and how to make them a variable. I checked how a WP gallery shortcode is done https://www.advancedcustomfields.com/resources/gallery/ but instead of the IDs I need the URL. I also tried using implode to add commas between values, but couldn’t make it work.
Could you please guide me into the right direction to solve this??
My not-working code is below. Thanks!
<!-- trying to get the array of URLs -->
<?php
$images = get_field('slideshow_gallery', 'option');
if( $images ):
foreach( $images as $image ): ?>
<?php echo $image['url']; ?>,
<br>
<?php endforeach; ?>
<?php endif; ?>
</div>
<!-- Put the URLs inside a div -->
<div id="dom-target" style="display: none;">
<?php
$output = "image01", "image02", "image03"; //just a test
echo htmlspecialchars($output); /* You have to escape because the result will not be valid HTML otherwise. */
?>
</div>
<!-- Put the content into a variable -->
<script>
var div = document.getElementById("dom-target");
var myData = div.textContent;
</script>
<script> /* Build backstretch slideshow */
// Duration is the amount of time in between slides,
// and fade is value that determines how quickly the next image will fade in
$.backstretch([
myData
], {
duration: 3000,
fade: 750
});
</script>
