1#@!#!123s

: / proc / thread-self / root / home / sanghavirealty / www / wp-content / plugins / image-slider /
Filename : image-slider.php
back
<?php
/**
 * Plugin Name: image_slider
 * Plugin URI: http://www.gems.com/image_slider
 * Description: The very first plugin that I have ever created.
 * Version: 1.0
 * Author: image_slider
 * Author URI: http://www.gems.com
 */


// Add Shortcode
function image_slider() {
  ob_start();
  ?>



   <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">

  </head>
  <body>


	  <div class="owl-carousel image__slider">
	    <div class="item">
            <div class="image__slider__inner">
                <img src="<?php echo site_url(); ?>/wp-content/uploads/2024/12/Centroid-For-Website.png">
            </div>
        </div>
        <div class="item">
            <div class="image__slider__inner">
                <img src="<?php echo site_url(); ?>/wp-content/uploads/2024/12/Manor-Ananda-For-Website.png">
            </div>
        </div>
	  </div>
   





    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
    <script type="text/javascript">
     jQuery('.image__slider').owlCarousel({
                loop:true,
                margin:20,
                nav:true,
                dots:false,
                // autoplay:true,
                // autoplayTimeout:4000,
                responsive:{
                    0:{
                        items:1
                    },
                    600:{
                        items:1
                    },
                    1000:{
                        items:1
                    }
                }
            });
    </script>




 <?php

  return ob_get_clean();

}
add_shortcode( 'image-slider', 'image_slider' );