first commit

templates_user/articles/product-gallery.php

@@ -0,0 +1,39 @@
+<div class="pictures">
+  <div class="subpages-slider-container">
+    <div class="splide subpages-slider-<?= $this -> article_id; ?>-<?= $this -> i; ?>">
+      <div class="splide__track">
+        <ul class="splide__list">
+          <? foreach ( $this -> images as $image ):?>
+            <li class="splide__slide">
+              <a href="/<?= $this -> path;?><?= $image;?>" class="image">
+                <img alt="" src="/<?= $this -> path;?><?= $image;?>" style="max-width: 100%;" />
+              </a>
+            </li>
+          <? endforeach;?>
+        </ul>
+      </div>
+    </div>
+  </div>
+</div>
+<script class="footer" type="text/javascript">
+
+  $(function() {
+    $( ".pictures .splide__list .splide__slide a.image" ).fancybox({
+      closeBtn		: true,
+    });
+  })
+
+  const checkSlider_<?= $this -> article_id;?>_<?= $this -> i;?> = document.querySelector( '.subpages-slider-<?= $this -> article_id; ?>-<?= $this -> i; ?>' );
+  if ( checkSlider_<?= $this -> article_id;?>_<?= $this -> i;?> )
+  {
+    let checkSlider_<?= $this -> article_id;?>_<?= $this -> i;?> = new Splide( ".subpages-slider-<?= $this -> article_id; ?>-<?= $this -> i; ?>", {
+      direction   : "ltr",
+      perPage     : 1,
+      autoplay    : false,
+      arrows      : true,
+      pagination  : false,
+      type        : 'loop',
+    });
+    checkSlider_<?= $this -> article_id;?>_<?= $this -> i;?>.mount();
+  }
+</script>