from an Image Array
function enqueue_random_background_script() {
// Define the folder containing your images
$image_url_folder = get_stylesheet_directory_uri() . '/images/backgrounds/';
$image_path = get_stylesheet_directory() . '/images/backgrounds/';
// Dateien mit den Endungen .jpg, .jpeg, .png, .gif finden
$files = glob( $image_path . '/*.{jpg,jpeg,png,gif}', GLOB_BRACE );
// Invalid directory or empty directory
if(empty($files)){
return;
}
// Dateien in URLs umwandeln
$file_urls = array_map( function ($file) use ($image_path, $image_url_folder){
return str_replace( $image_path, $image_url_folder, $file );
}, $files );
// Pass the image URLs to JavaScript
wp_enqueue_script('random-bg-script', get_stylesheet_directory_uri() . '/js/random-bg.js', array(), null, true);
wp_localize_script('random-bg-script', 'randomBgData', array(
'images' => $file_urls,
));
}
add_action('wp_enqueue_scripts', 'enqueue_random_background_script');random-bg.js
document.addEventListener('DOMContentLoaded', function () {
const element = document.getElementById('randomized');
if (element && randomBgData.images.length > 0) {
const randomImage = randomBgData.images[Math.floor(Math.random() * randomBgData.images.length)];
element.style.backgroundImage = `url(${randomImage})`;
console.log(randomImage);
}
});// In Abhängigkeit von Wochentagen ein anderes Hintergrundbild zeigen
function schedule_bg_image() {
?>
<script type="text/javascript">
var imglocation = "/wp-content/uploads/";
function ImageArray (n) {
this.length = n;
for (var i =1; i <= n; i++) {
this[i] = ' '
}
}
image = new ImageArray(7);
image[0] = 'o2-7.jpg'; // Sunday
image[1] = 'o2-1.jpg'; // Monday
image[2] = 'o2-2.jpg'; // Tuesday
image[3] = 'o2-3.jpg'; // Wednesday
image[4] = 'o2-4.jpg'; // Thursday
image[5] = 'o2-5.jpg'; // Friday
image[6] = 'o2-6.jpg'; // Saturday
var currentdate = new Date();
var imagenumber = currentdate.getDay();
document.getElementById('weekday').style.backgroundImage = 'url(' + imglocation + image[imagenumber] + ')';
</script>
<?php
}
add_action( 'wp_footer', 'schedule_bg_image' );
// Ende Wochentags SchedulingSie sehen gerade einen Platzhalterinhalt von Facebook. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.
Mehr InformationenSie sehen gerade einen Platzhalterinhalt von Instagram. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.
Mehr Informationen