to generate the galerie, you can put this shortcode in the file functions.php
of your theme (create a child theme if the theme can be updated)
add_shortcode("webcamPictures", function ($attr, $content, $tag) {
$picturesByLine = 5;
$directoryBase = realpath(__DIR__ . "/../../../images");
$urlBase = home_url("/images");
// reading pictures
$picturesRaw = glob("$directoryBase/{$attr["type"]}*");
$pictures = [];
foreach ($picturesRaw as $p) {
$pictures[] = [
"filename" => basename($p),
"mtime" => filemtime($p),
];
}
// sorting
usort($pictures, function ($p1, $p2) {
return $p2["mtime"] - $p1["mtime"];
});
// display
$firstPicture = array_shift($pictures);
$firstPictureURL = "$urlBase/{$firstPicture["filename"]}";
$picturesEnd = count($pictures) - 1;
ob_start();
?>
<table class=" table table-hover"
style="table-layout: fixed; border-collapse: separate; border-spacing: 30px;">
<tbody>
<tr>
<td style="bgcolor="#EAEAEA"><a
href="https://wordpress.stackexchange.com/questions/285582/<?php echo esc_html($firstPictureURL);?>"><img
src="https://wordpress.stackexchange.com/questions/285582/<?php echo esc_html($firstPictureURL);?>"></a>
</td>
</tr>
</tbody>
</table>
<table class=" table table-hover"
style="table-layout: fixed; border-collapse: separate; border-spacing: 30px;">
<tbody>
<tr>
<?php foreach ($pictures as $index => $p) {?>
<?php
$pictureURL = "$urlBase/{$p["filename"]}";
?>
<td style="width: 20%;" bgcolor="#EAEAEA"><a
href="<?php echo esc_html($pictureURL);?>"><img
src="<?php echo esc_html($pictureURL);?>"></a>
</td>
<?php
if ( (0 === ($index + 1) % $picturesByLine)
&& ($index !== $picturesEnd)
) {
?>
</tr><tr>
<?php }?>
<?php }?>
</tr>
</tbody>
</table>
<?php
$content = ob_get_clean();
return $content;
});
to use this shortcode, put this in your page content : [webcamPictures type="CGCHdCam1"]