HOME

Mini Shell 1.0
DIR:/proc/self/root/home/kgnmthp.in/www/wp-content/themes/twentytwentyone-child/
Current File : //proc/self/root/home/kgnmthp.in/www/wp-content/themes/twentytwentyone-child/front-page.php
<?php 
/* Template Name: Home Template */

get_header();

?>
<section class="banner">
  <div id="bootstrap-touch-slider" class="carousel bs-slider fade control-round indicators-line" data-ride="carousel" data-pause="hover" data-interval="5000">
  
    <!-- Indicators -->
    <ol class="carousel-indicators hidden">
      <li data-target="#bootstrap-touch-slider" data-slide-to="0" class="active"></li>
      <li data-target="#bootstrap-touch-slider" data-slide-to="1"></li>
      <li data-target="#bootstrap-touch-slider" data-slide-to="2"></li>
      <li data-target="#bootstrap-touch-slider" data-slide-to="3"></li>
      <li data-target="#bootstrap-touch-slider" data-slide-to="4"></li>
      <li data-target="#bootstrap-touch-slider" data-slide-to="5"></li>
    </ol>
    
	<?php 
$image = get_field('banner_image');

$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image ) {
   //  echo wp_get_attachment_image( $image, $size );
}
?>

<?php 
$image2 = get_field('banner_image_2');

$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image2 ) {
   //  echo wp_get_attachment_image( $image, $size );
}
?>
	  <?php 
$image3 = get_field('banner_image_3');

$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image3 ) {
   //  echo wp_get_attachment_image( $image, $size );
}
?>
	  <?php 
$image4 = get_field('banner_image_4');

$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image4 ) {
   //  echo wp_get_attachment_image( $image, $size );
}
?>
	  <?php 
$image5 = get_field('banner_image_5');

$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image5 ) {
   //  echo wp_get_attachment_image( $image, $size );
}
?>




    <!-- Wrapper For Slides -->
    <div class="carousel-inner" role="listbox">
      <!-- Third Slide -->
      <div class="item active">
	 
	  <?php echo wp_get_attachment_image( $image, $size ); ?>
     
      </div><!-- End of Slide -->           
      
      <div class="item">
        <!-- <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/slider-02.jpg" alt="image"  class="slide-image"/> -->
		<?php echo wp_get_attachment_image( $image2, $size ); ?>
      </div><!-- End of Slide -->
    
      <div class="item">
        <!-- <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/slider-02.jpg" alt="image"  class="slide-image"/> -->
		<?php echo wp_get_attachment_image( $image3, $size ); ?>
      </div><!-- End of Slide -->
      <div class="item">
        <!-- <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/slider-02.jpg" alt="image"  class="slide-image"/> -->
		<?php echo wp_get_attachment_image( $image4, $size ); ?>
      </div><!-- End of Slide -->
      <div class="item">
        <!-- <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/slider-02.jpg" alt="image"  class="slide-image"/> -->
		<?php echo wp_get_attachment_image( $image5, $size ); ?>
      </div><!-- End of Slide -->
    </div><!-- End of Wrapper For Slides -->
    
    
    <!-- Left Control -->
    <a class="left carousel-control" href="#bootstrap-touch-slider" role="button" data-slide="prev"><span class="fa fa-angle-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a>
    
    <!-- Right Control -->
    <a class="right carousel-control" href="#bootstrap-touch-slider" role="button" data-slide="next"><span class="fa fa-angle-right" aria-hidden="true"></span><span class="sr-only">Next</span></a>
  
  </div> <!-- End  bootstrap-touch-slider Slider -->    
  <div class="breaking-news-col">
    <div class="breaking-news">
	  <div class="breaking-title"><i class="fa fa-bullhorn" aria-hidden="true"></i> Notifications</div>
	  <div class="breaking-block">
		<marquee behavior="scroll" direction="left" scrollamount="5" onmouseover="this.stop();" onmouseout="this.start();">To foster a sensitive, supportive, and synchronized ecosystem for children as 
they transit different ages and stages of their development.</marquee>
	  </div>
		
	  <!--div class="breaking-controls"></div-->
	</div>
  </div>  
</section><!--/ banner -->     

<section class="Our-Mission">
  <div class="container">
    <div class="row">
      
      <div class="col-sm-12 mrb-20">
	    <div class="title-row">		  
		    <h2><span><?php the_field('memorial_trust_heading');?></span> <?php the_field('memorial_trust_span');?></h2>
		    <figure><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/title-icon.png" alt="images"></figure>
		  </div>
	  </div>
	  
      <div class="col-sm-7 mrb-30 left">
        <div class="text-padd">
		
		  <?php the_field('memorial_trust_left_content');?>

		  <p><a href="<?php the_field('memorial_trust_left_link');?>" class="btn">View More</a></p>
        </div>
      </div>
      
      <div class="col-sm-5 mrb-30 right">

	  <?php 
         $image4 = get_field('memorial_trust_right_content');
           $size = 'full'; // (thumbnail, medium, large, full or custom size)
          if( $image4 ) {
            //echo wp_get_attachment_image( $image3, $size );
          }
        ?>

	    <div class="practice-box">
		  <!-- <figure><img class="thumbnail" src="<?php echo get_stylesheet_directory_uri(); ?>/images/about.jpg" alt="image"></figure> -->

      <!-- <figure><img class="thumbnail" src="<?php echo wp_get_attachment_image( $image4, $size ); ?>" alt="image"></figure> -->

		 <figure class="thumbnail"><?php echo wp_get_attachment_image( $image4, $size ); ?></figure>

		</div>
	  </div>  	  	 
      
    </div><!--/ row --> 
  </div>
</section><!--/ Our-Mission -->

<section class="tag-sec">
  <div class="container">
    <div class="row">     

	

	  <div class="col-sm-12">
        <h2><?php the_field('latest_update_heading');?><span><?php the_field('latest_update_span');?></span></h2>  
	  </div>
	  
	  <div class="col-sm-12 tag-coll">
	    <div class="tag-box">
		  <div class="notice-board">
			  <marquee direction="up" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="3" height="210px;">
			    <ul>
				  <li><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/tnew.gif"><a href="<?php the_field('link');?>"><span><?php the_field('news_1');?> </span><?php the_field('news_1_span');?></a></li>


				  <li><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/tnew.gif"><a href="<?php the_field('news_2_link');?>"><span><?php the_field('news_2');?> </span><?php the_field('news_2_span');?></a></li>


				  <li><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/tnew.gif"><a href="<?php the_field('news_3_link');?>"><span><?php the_field('news_3');?> </span><?php the_field('news_3_span');?></a></li>



				  <li><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/tnew.gif"><a href="<?php the_field('news_4_link');?>"><span><?php the_field('news_4');?> </span><?php the_field('news_4_span');?></a></li>
          <li><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/tnew.gif"><a href="<?php the_field('news_5_link');?>"><span><?php the_field('news_5');?> </span><?php the_field('news_5_span');?></a></li>
				</ul>
			  </marquee>
	        </div>
        </div>
      </div><!--/ tag-coll -->	  
     
    </div><!--/ row --> 
  </div>
</section>       


<section class="about-text">
  <div class="container">
    <div class="row">           
      	  
      <div class="col-sm-12">
        <div class="title-row">		  
		  <h2><?php the_field('inner_heading');?><span><?php the_field('inner_heading_span');?></span></h2>
		  <figure><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/title-icon.png" alt="images"></figure>
		</div>
	  </div>
	  
	  <div class="col-sm-6 about-text-left">
        <div class="about-padd">		
		  <!-- <ol>
		    <li>Conduct and promotion of such charitable activities as would conduce to the general welfare of the condition of poor and needy women and children in the rural areas in India.</li>
			<li>Establishment and maintenance of Hospitals and Charitable Dispensaries for women and children Maternity Homes , Child welfare Centers  and Institutions of similar nature ,such as ante-natal and post-natal clinics , convalescent homes  sanatoria , leper colonies etc. Homes for  women and for children in the rural areas  in India.</li>
			<li>The provision of sanitary facilities for women and children and promoting preventive measures affecting the health of women children in the rural area of India.</li>
			<li>Promotion and encouragement of primary education , training in handicrafts , cottage industries and other usual crafts amongst the women  and children in rural areas in India.</li>
			<li>The training of women for carrying out any of aforesaid activities.</li>
			<li>Rendering help by grant and contribution to any existing institutions which have been carrying out existing institutions to carry on, in the rural areas of India, work falling within all or any of the objects mentioned in the above sub –clauses ( 1) to (5) here of for the purpose of carrying out any of the aforesaid objects.</li>
			<li>Any other activity incidental or germane to the aforesaid objects.</li>
		  </ul> -->

		  <?php the_field('left_side_content');?>


        </div><!--/ about-padd -->
      </div><!--/ col-sm-6 -->

	  <?php 
$image3 = get_field('right_side_content');
$size = 'full'; // (thumbnail, medium, large, full or custom size)
if( $image3 ) {
     //echo wp_get_attachment_image( $image3, $size );
}
?>
	  
	  <div class="col-sm-6 about-text-right">


        <!-- <figure><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/img-01.jpg" alt="images"></figure> -->

		<figure><?php echo wp_get_attachment_image( $image3, $size ); ?></figure> 

      </div><!--/ col-sm-8 -->      	  	 
     
    </div><!--/ row --> 
  </div>
</section><!--/ about-text -->

<section class="text-tag">
  <div class="container">
    <div class="row">

    <?php 
         $image5 = get_field('image');
           $size = 'full'; // (thumbnail, medium, large, full or custom size)
          if( $image5 ) {
            //echo wp_get_attachment_image( $image3, $size );
          }
        ?>

	
	  <div class="col-sm-12">
	    <div class="title-row">		  
		    <h2><span> <?php the_field('gandhi_darshan_heading');?></span> <?php the_field('gandhi_darshan_span');?></h2>
		    <figure><?php echo wp_get_attachment_image( $image5, $size ); ?></figure>
		</div>
		<?php the_field('gandhi_darshan_content');?>
		<p><a href="<?php the_field('gandhi_darshan_link');?>" class="btn"><?php the_field('gandhi_darshan_button');?></a></p>
	  </div>

    </div><!--/ row --> 
  </div>
</section><!--/ text-tag -->

<section class="Our-Mission our-info">
  <div class="container">
    <div class="row">

    <?php 
         $image6 = get_field('our_mission_image');
           $size = 'full'; // (thumbnail, medium, large, full or custom size)
          if( $image6 ) {
            //echo wp_get_attachment_image( $image3, $size );
          }
        ?>
      
      <div class="col-sm-6 mrb-30">
        <div class="text-padd">
          <div class="title-row">		  
		    <h2><span><?php the_field('our_mission_left');?></span> <?php the_field('our_mission_span');?></h2>
		    <figure><?php echo wp_get_attachment_image( $image6, $size ); ?></figure>
		  </div>
		  <?php the_field('our_mission_content');?>
		  
		  <p><a href="<?php the_field('our_mission_link');?>" class="btn"><?php the_field('our_mission_text');?></a></p>
        </div>
      </div>


      <?php 
         $image7 = get_field('our_mission_right_image');
           $size = 'full'; // (thumbnail, medium, large, full or custom size)
          if( $image7 ) {
            //echo wp_get_attachment_image( $image3, $size );
          }
        ?>
	  
	  <div class="col-sm-6 mrb-30">
        <div class="text-padd">
          <div class="title-row">		  
		    <h2><span><?php the_field('our_mission_right_heading');?></span><?php the_field('our_mission_right_span');?></h2>
		    <figure><?php echo wp_get_attachment_image( $image7, $size ); ?></figure>
		  </div>
		  <?php the_field('our_mission_right_content');?>
		 
		  <p><a href="<?php the_field('our_mission_right_link');?>" class="btn"><?php the_field('our_mission_right_button_text');?></a></p>
        </div>
      </div>	  	 
      
    </div><!--/ row --> 
  </div>
</section><!--/ Our-Mission -->

<section class="gallery-sec">
  <div class="container">
    
	<div class="row">
	  <div class="col-sm-12">
		<div class="title-row">		  
		  <h2>Photo <span>Gallery</span></h2>
		  <figure><img src="<?php echo get_stylesheet_directory_uri(); ?>/images/title-icon.png" alt="images"></figure>
		</div>	
	  </div>
	</div>
	  
	<div class="portfolio-item row">
    
    
    <?php      
$the_query = new WP_Query( array(
    'post_type' => 'gallery',
    'posts_per_page' => -1,
    'orderby' => 'meta_value',
    'order' => 'ASC',
) );

while ( $the_query->have_posts() ) :
    $the_query->the_post(); ?>

<?php 
$image_url = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );
?> 
      <div class="item col-sm-4"><a href="<?php echo $image_url[0]; ?>" class="fancylight popup-btn" data-fancybox-group="light"><img class="img-fluid" src="<?php echo $image_url[0]; ?>" alt=""></a></div><!--/ end -->
<?php      
endwhile;

wp_reset_postdata(); ?>      
      
      
    </div><!--/ portfolio-item -->
	
<script>
        // $('.portfolio-item').isotope({
        //  	itemSelector: '.item',
        //  	layoutMode: 'fitRows'
        //  });
         $('.portfolio-menu ul li').click(function(){
         	$('.portfolio-menu ul li').removeClass('active');
         	$(this).addClass('active');
         	
         	var selector = $(this).attr('data-filter');
         	$('.portfolio-item').isotope({
         		filter:selector
         	});
         	return  false;
         });
         $(document).ready(function() {
         var popup_btn = $('.popup-btn');
         popup_btn.magnificPopup({
         type : 'image',
         gallery : {
         	enabled : true
         }
         });
         });	  
</script>
  </div><!--/ container -->
</section><!--/ gallery-sec -->

<?php get_footer(); ?>