Gallery Element, randomized images?

Hello Christian,

Please let us know what platform to publish the site is used, is it a CMS-based site or an HTML site?
This will need additional coding or a plugin/module if a WordPress/Joomla-based site, we do not have such a feature to show random images in Nicepage.
...................................................
Sincerely,
Anna.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Moin Christian,
das geht mit den Bordmitteln von Nicepage leider nicht.
Dies kannst du aber recht simpel mit JavaScript lösen.
Kleines Beispiel:
`

<img src="bild1.jpg" alt="Bild 1">
<img src="bild2.jpg" alt="Bild 2">
<img src="bild3.jpg" alt="Bild 3">

// Funktion zum Mischen eines Arrays (Fisher-Yates Algorithmus)

function shuffleArray(array) {
  for (let i = array.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [array[i], array[j]] = [array[j], array[i]];
  }
}

// Holt sich alle Bilder im Galerie-Container
const galleryContainer = document.getElementById("gallery");
const images = Array.from(galleryContainer.getElementsByTagName("img"));

// Mischt die Reihenfolge der Bilder
shuffleArray(images);

// Entfernen die Bilder aus dem Container
images.forEach((image) => {
  galleryContainer.removeChild(image);
});

// fügt die gemischten Bilder wieder in den Container ein
images.forEach((image) => {
  galleryContainer.appendChild(image);
});

`

Last edited 16 November 2023 by Reik

Hi Anna, thanks for your super-fast reply.
Well, I intend to create a new joomla-template (and yes I know, I could use a 3rd-party plug-in). I thought I could it hold possibly simple if I do the work in a template, created with nicepage.
Yours, Christian

Hello Christian,

Please let us know what platform to publish the site is used, is it a CMS-based site or an HTML site?
This will need additional coding or a plugin/module if a WordPress/Joomla-based site, we do not have such a feature to show random images in Nicepage.
...................................................
Sincerely,
Anna.
Nicepage Support Team

Please subscribe to our YouTube channel: http://youtube.com/nicepage?sub_confirmation=1
Follow us on Facebook: http://facebook.com/nicepageapp

Einen schönen guten Morgen Reik,
Vielen Dank für die super-schnelle Unterstützung durch dieses schöne Script, welches ich gerne einsetze, wenn es mit nicepage nicht geht. Würdest dieses Script manuell ins template plazieren oder über die Joomla-Admin (4.x) einfügen? (und höchstwahrscheinlich im einsetzen.
Danke schön im Voraus.
Christian

Moin Christian,
das geht mit den Bordmitteln von Nicepage leider nicht.
Dies kannst du aber recht simpel mit JavaScript lösen.
Kleines Beispiel:
`

// Funktion zum Mischen eines Arrays (Fisher-Yates Algorithmus)

function shuffleArray(array) {
  for (let i = array.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    , array] = , array];
  }
}

// Holt sich alle Bilder im Galerie-Container
const galleryContainer = document.getElementById("gallery");
const images = Array.from(galleryContainer.getElementsByTagName("img"));

// Mischt die Reihenfolge der Bilder
shuffleArray(images);

// Entfernen die Bilder aus dem Container
images.forEach((image) => {
  galleryContainer.removeChild(image);
});

// fügt die gemischten Bilder wieder in den Container ein
images.forEach((image) => {
  galleryContainer.appendChild(image);
});

`