Initial Commit

templates/video.php

@@ -0,0 +1,93 @@
+<?php 
+/**
+ * Template Name: video page
+ 
+ */
+get_header(); ?>
+<section class="section-top">
+    <div class="container">
+        <div class="col-lg-10 offset-lg-1 text-center">
+            <div class="section-top-title">
+                <h1>Explore Our Gallery</h1>
+                <ul>
+                    <li><a href="/">Home</a></li>
+                    <li class="ms-1"> / Videos</li>
+                </ul>
+            </div>
+        </div>
+    </div>
+</section>
+
+<section class="custom-gallery-container">
+    <div class="container">
+        <div class="row">
+
+        <?php
+        $args = array(
+            'post_type'      => 'video',
+            'posts_per_page' => -1,
+            'post_status'    => 'publish'
+        );
+
+        $result = new WP_Query($args);
+
+        if ($result->have_posts()) :
+            while ($result->have_posts()) : $result->the_post();
+
+                $video_url = get_field('youtube_video'); // SINGLE ACF field
+                $title     = get_the_title();
+                $desc      = get_the_content();
+
+                if (!$video_url) continue;
+
+                // Extract YouTube Video ID
+                if (preg_match('/(?:youtube\.com\/.*v=|youtu\.be\/)([^"&?\/\s]{11})/', $video_url, $matches)) {
+                    $video_id = $matches[1];
+                } else {
+                    continue;
+                }
+        ?>
+
+            <div class="col-lg-3 col-md-6 mb-3 custom-gallery-item gallery-item">
+                <a href="#"
+                   data-bs-toggle="modal"
+                   data-bs-target="#videoModal"
+                   data-video="https://www.youtube.com/embed/<?php echo esc_attr($video_id); ?>"
+                   data-type="youtube">
+
+                    <div class="custom-gallery-img">
+                        <img src="https://img.youtube.com/vi/<?php echo esc_attr($video_id); ?>/mqdefault.jpg"
+                             class="img-fluid"
+                             alt="<?php echo esc_attr($title); ?>">
+
+                        <div class="play-icon">
+                            <i class="fas fa-play"></i>
+                        </div>
+                    </div>
+                </a>
+
+                <div class="video-description">
+                    <h3><?php echo esc_html($title); ?></h3>
+                    <p>
+                        <?php
+                        echo esc_html(mb_substr(wp_strip_all_tags($desc), 0, 50));
+                        echo (mb_strlen($desc) > 50) ? '...' : '';
+                        ?>
+                    </p>
+                </div>
+            </div>
+
+        <?php
+            endwhile;
+            wp_reset_postdata();
+        endif;
+        ?>
+
+        </div>
+    </div>
+</section>
+
+  <nav class="mt-4">
+  <ul class="pagination justify-content-center" id="pagination"></ul>
+</nav>
+<?php get_footer(); ?>