Advertisement
Guest User

Archive Index

a guest
Apr 3rd, 2015
225
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 19.51 KB | None | 0 0
  1. <?php
  2. /*
  3. Template Name: Franchise Main
  4. */
  5. ?>
  6. <?php get_header('franchise'); ?>
  7. <style>
  8.  
  9. #home {
  10.             background: url(<?php the_field('fbimage3', 'options'); ?>) 50% 0 fixed;
  11.             height: auto;  
  12.             margin: 0 auto;
  13.             width: 100%;
  14.             position: relative;
  15.             padding: 20px 0;
  16.             background-position:center;
  17.                 -webkit-background-size: cover;
  18.     -moz-background-size: cover;
  19.     -o-background-size: cover;
  20.     background-size: cover;
  21.     width: 100%;
  22.         }
  23. </style>
  24. <style>
  25. #gform_submit_button_3{
  26. background-color: red;
  27. width: 100%;
  28. border: 0px;
  29. border-radius: 0px;
  30. color: white;
  31. font-family: bebas-neue;
  32. font-size: 30px;
  33. }
  34. #field_3_1 > label,#field_3_2 > label,#field_3_3 > label,#field_3_4 > label,#field_3_5 > label{
  35. display: none;
  36. }
  37. input[type="text"]{
  38. background: rgba(195, 195, 195, 0.01);
  39. border: 1px solid white;
  40. color: white;
  41. width: 100% !important;
  42. }
  43. ::-webkit-input-placeholder { /* WebKit browsers */
  44.     color: white;
  45. }
  46. :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  47.    color: white;
  48.    opacity:  1;
  49. }
  50. ::-moz-placeholder { /* Mozilla Firefox 19+ */
  51.    color: white;
  52.    opacity:  1;
  53. }
  54. :-ms-input-placeholder { /* Internet Explorer 10+ */
  55.    color: white;
  56. }
  57.  
  58.  
  59. </style>
  60. <!--------------------------------parallax area start--------------------------- -->
  61. <section id="home" class="section" data-stellar-background-ratio="0.5">
  62.     <div class="container">
  63.         <div class="row">
  64.             <div class="col-md-7 big-word">
  65.                 <h1>
  66. <?php the_field('f_search_title','options'); ?>
  67.  
  68. </h1>
  69.             </div>
  70.             <div class="col-md-5 formarea">
  71.                   <div class="form-group">
  72.                     <?php echo do_shortcode('[gravityform id="3" title="false" description="true"]'); ?>
  73.                   </div>
  74.             </div>
  75.         </div>
  76.     </div>
  77. </section>
  78. <!--------------------------------parallax area end----------------------------->
  79.  
  80. <!--------------------------------welcome area start--------------------------- -->
  81. <div class="container-fluid welcome-area">
  82.     <div class="container">
  83.         <div class="row">
  84.             <div class="col-md-12 col-sm-12">
  85.                 <h2 class="text-center"><?php the_field('f_welcome_title','options'); ?>
  86.                 </h2>
  87.             </div>
  88.            
  89.         </div> 
  90.         <div class="row top-spacing">
  91.             <div class="col-md-8 col-sm-8 col-xs-12">
  92.                 <div class="sub-text"><?php the_field('f_left_content','options'); ?></div>
  93.            
  94.  <button type="button" class="btn btn-danger col-md-6 recieve-butn col-xs-12">COMPLIMENTRY ESTIMATE</button>
  95.             </div>
  96.             <div class="col-md-4 col-sm-4 col-xs-12" id="top-spacing"><span id="service"></span>
  97.                  <div class="sub-text"><?php the_field('f_right_content','options'); ?></div>
  98.                  <a href="#quote">
  99.                
  100.                  </a>
  101.             </div> 
  102.            
  103.         </div>
  104.     </div>
  105. </div>
  106. <!--------------------------------welcome area end----------------------------->
  107.  
  108. <!--------------------------------Our service area start--------------------------- -->
  109. <div class="container-fluid services">
  110.     <div class="container">
  111.         <div class="row top-spacing">
  112.                <div class="col-md-12 col-sm-12">
  113.                 <h2 class="text-center">Multi-Industry Pressure Washing Experts </h2>
  114.             </div>
  115.             <?php $i=0; if( have_rows('f_services_blocks','options') ):
  116.                             while ( have_rows('f_services_blocks','options') ) : the_row(); ?>
  117.  
  118.            
  119.             <div class="col-md-4 col-lg-4 col-sm-4 col-xs-12 indexing">
  120.             <div class="col-md-12 gray_bg col-lg-12 col-sm-12 col-xs-12 left_spacing right_spacing top-border">
  121.             <img src="<?php the_sub_field('image'); ?>" class="img-responsive image hidden-xs" />
  122.          
  123.             <div class="col-md-12 col-xs-12 col-lg-12 col-sm-12">
  124.             <p class="service_txt text-center"><a href="<?php the_sub_field('url'); ?>"><?php the_sub_field('title'); ?></a></p>
  125.             <?php the_sub_field('text'); ?>
  126.             <a href="#gallary">
  127.             <button type="button" class="btn btn-danger recieve-butn center-block top-spacing">View Featured Projects</button>
  128.             </a>
  129.         </div>
  130.           </div>
  131.         </div>
  132.                 <?php $i++; if ($i == 3): ?>
  133.               <div class="clearfix"></div>
  134.                     <?php $i=0; endif; ?>          
  135.           <?php endwhile; endif; ?>
  136.  
  137.     </div>
  138. </div>
  139. </div>
  140. <!--------------------------------Our service area end----------------------------
  141.  
  142. <!--------------------------------Gallary area start--------------------------- -->
  143. <div class="container-fluid gallery">
  144. <span id="gallary"></span>
  145.     <div class="container">
  146.         <div class="row">
  147.             <div class="col-md-12 col-sm-12">
  148.                 <h2 class="text-center">FEATURED PROJECTS</h2>
  149.             </div>
  150.             <div class="row">
  151.              <div class="portfolioFilter text-center">
  152.            
  153.                 <a href="#" class="current" data-filter=".commercial">COMMERCIAL / </a>
  154.                 <a href="#" data-filter=".people">RESIDENTIAL / </a>
  155.                 <a href="#" data-filter=".places">FLEET / </a>
  156.                 <a href="#" data-filter=".food">CONSTRUCTION / </a>
  157.                 <a href="#" data-filter=".objects">INDUSTRIAL / </a>
  158.              
  159.             </div>
  160.             </div>
  161.             <div class="row">
  162.             <div class="portfolioContainer">
  163.            
  164.            
  165.                         <?php if( have_rows('f_projects','options') ):
  166.                             while ( have_rows('f_projects','options') ) : the_row(); ?>
  167.            
  168.            
  169.                  <div class="<?php echo $class; ?> col-md-3 ih-item square effect6 from_top_and_bottom col-lg-3 col-sm-3 top-spacing"><a href="<?php the_sub_field('url'); ?>">
  170.                    <div class="img">
  171.                    <a href="<?php the_sub_field('image'); ?>" class="group1 cboxElement">
  172.                     <img src="<?php the_sub_field('image'); ?>" alt="image" width="270" height="185" class="img-responsive"></div>
  173.                     </a>
  174.                    <div class="info">
  175.                    <div class="col-md-5 col-xs-5"></div>
  176.                    <div class="col-md-2 magnify col-xs-2">
  177.                    
  178.                      <img src="<?php bloginfo('template_url'); ?>/franchise_images/magnify.png" class="img-responsive" />
  179.                    </div>
  180.                    <div class="col-md-5 col-xs-5"></div>  
  181.                      
  182.                     </div></a>                 
  183.                 </div>  
  184.              
  185.                        <?php endwhile; endif; ?>
  186.  
  187.  
  188.              
  189.  
  190.                 </div>        
  191.         </div><span id="quote"></span>
  192.     </div>
  193. </div>
  194. </div>
  195. <!--------------------------------Gallary area end----------------------------->
  196.  
  197. <!--------------------------------request a quote area start--------------------------- -->
  198. <div class="container-fluid quote-area">
  199.     <div class="container">
  200.         <div class="row top-spacing">
  201.             <div class="col-md-12 col-sm-12">
  202.                 <h2 class="text-center">Request A Quote</h2>
  203.             </div>
  204.             <?php echo do_shortcode('[gravityform id="1" title="false" description="true"]'); ?>                
  205.         </div>
  206.     </div>
  207. </div>
  208. <!--------------------------------request a quote area end----------------------------->
  209.  
  210.  
  211.  
  212.  
  213.  
  214.  <!-------------------------------testimonial area start------------------------------->
  215.   <div class="container-fluid  testimonial">
  216.   <div class="container">
  217.     <div class="row">
  218.     <div class="col-md-12 col-sm-12 col-xs-12 col-lg-12">
  219.        <h2 class="text-center">SEE WHAT OUR SATISFIED CUSTOMERS ARE SAYING</h2>
  220.        <h4 class="black_txt text-center">Satisfying our customers is always our goal, and everything we do supports your needs. If you’re still not sure about Sparkle Wash, we invite you to check out what others are saying. </h4>
  221.     </div>
  222.       <div class="col-md-12 top-spacing col-sm-12 col-xs-12 col-lg-12">
  223.         <div class="owl-carousel2">
  224. <?php if( have_rows('f_customers','options') ):
  225.     while ( have_rows('f_customers','options') ) : the_row(); ?>
  226.    
  227.           <div class="item">
  228.             <div class="col-md-10 col-sm-10 col-xs-12 col-lg-10">
  229.               <div class="text-center testi-txt"><?php the_sub_field('text','options'); ?></div>
  230.               <p><?php the_sub_field('name','options'); ?></p>
  231.             </div>
  232.             <div class="col-md-2 col-sm-2 col-xs-12 col-lg-2"> <img src="<?php the_sub_field('photo','options'); ?>" class="img-responsive" /> </div>
  233.           </div>
  234. <?php endwhile; endif; ?>
  235.  
  236.         </div>
  237.       </div>
  238.     </div>
  239.   </div><span id="offers"></span>
  240.   </div>
  241. <!------------------------------testimonial area end---------------------------->
  242.  
  243. <!--------------------------------services 2nd area start----------------------------->
  244. <div class="container-fluid">
  245.     <div class="row">
  246.                 <div class="col-md-12 col-sm-12 bottom-spacing">
  247.                 <h2 class="text-center">Some Heading here (special offers)</h2>
  248.                 </div>
  249.         <div class="col-md-12 col-lg-12 col-sm-12 col-xs-12 ">
  250.               <div class="owl-carousel">
  251.    
  252.                           <?php if( have_rows('fcorusel', 'options') ):
  253.                   while ( have_rows('fcorusel', 'options') ) : the_row(); ?>
  254.  
  255.      <div class="owl-item">
  256.         <div class="col-md-4 blue-bg-area col-lg-4 col-sm-4 col-xs-12">
  257.             <div class="service-heading"><?php the_sub_field('fblueblock_title'); ?></div>
  258.             <div class="service-sub"><?php the_sub_field('fblueblock_text'); ?></div>
  259.              
  260.         </div>
  261.         <div class="col-md-4 col-lg-4 col-sm-4 col-xs-12" >
  262.             <div class="col-md-12 left-spacing right-spacing col-sm-12 col-xs-12 hidden-xs">
  263.                 <img src="<?php the_sub_field('fimage_1'); ?>" class="img-responsive" />
  264.              </div>
  265.              <div class="col-md-12 left-spacing right-spacing red-service-area col-lg-12 col-sm-12" col-xs-12>
  266.                 <div class="service-heading text-center"><?php the_sub_field('fblock_1_title'); ?></div>
  267.                 <div class="service-sub text-center"><?php the_sub_field('fblock_1_text'); ?> </div>
  268.              </div>  
  269.         </div>
  270.         <div class="col-md-4 left-spacing col-lg-4 col-sm-4 col-xs-12">
  271.              <div class="col-md-12 left-spacing right-spacing red-service-area2">
  272.                 <div class="service-heading text-center"><?php the_sub_field('fblock_2_title'); ?></div>
  273.                 <div class="service-sub text-center"><?php the_sub_field('fblock_2_text'); ?></div>
  274.             </div>
  275.              <div class="col-md-12 left-spacing right-spacing cleang3 col-lg-12 col-sm-12 hidden-xs">
  276.                 <img src="<?php the_sub_field('fimage_2'); ?>" class="img-responsive" />
  277.              </div>
  278.         </div>
  279.     </div>
  280.     <?php endwhile; endif; ?>
  281.     </div>
  282.         <!--owl end-->
  283.         </div>
  284.     </div>
  285. </div>
  286. <!--------------------------------services 2nd area end----------------------------->
  287.  
  288.  
  289. <!--------------------------------Map area start------------------------------------>
  290.  
  291. <style type="text/css">
  292.  
  293. .acf-map {
  294.     width: 100%;
  295.     height: 400px;
  296.     border: #ccc solid 1px;
  297.     margin: 20px 0;
  298. }
  299.  
  300. </style>
  301.  
  302. <script type="text/javascript">
  303. (function($) {
  304.  
  305. /*
  306. *  render_map
  307. *
  308. *  This function will render a Google Map onto the selected jQuery element
  309. *
  310. *  @type    function
  311. *  @date    8/11/2013
  312. *  @since   4.3.0
  313. *
  314. *  @param   $el (jQuery element)
  315. *  @return  n/a
  316. */
  317.  
  318. function render_map( $el ) {
  319.  
  320.     // var
  321.     var $markers = $el.find('.marker');
  322.  
  323.     // vars
  324.     var args = {
  325.         zoom        : 16,
  326.         center      : new google.maps.LatLng(0, 0),
  327.         mapTypeId   : google.maps.MapTypeId.ROADMAP
  328.     };
  329.  
  330.     // create map              
  331.     var map = new google.maps.Map( $el[0], args);
  332.  
  333.     // add a markers reference
  334.     map.markers = [];
  335.  
  336.     // add markers
  337.     $markers.each(function(){
  338.  
  339.         add_marker( $(this), map );
  340.  
  341.     });
  342.  
  343.     // center map
  344.     center_map( map );
  345.  
  346. }
  347.  
  348. /*
  349. *  add_marker
  350. *
  351. *  This function will add a marker to the selected Google Map
  352. *
  353. *  @type    function
  354. *  @date    8/11/2013
  355. *  @since   4.3.0
  356. *
  357. *  @param   $marker (jQuery element)
  358. *  @param   map (Google Map object)
  359. *  @return  n/a
  360. */
  361.  
  362. function add_marker( $marker, map ) {
  363.  
  364.     // var
  365.     var latlng = new google.maps.LatLng( $marker.attr('data-lat'), $marker.attr('data-lng') );
  366.  
  367.     // create marker
  368.     var marker = new google.maps.Marker({
  369.         position    : latlng,
  370.         map         : map
  371.     });
  372.  
  373.     // add to array
  374.     map.markers.push( marker );
  375.  
  376.     // if marker contains HTML, add it to an infoWindow
  377.     if( $marker.html() )
  378.     {
  379.         // create info window
  380.         var infowindow = new google.maps.InfoWindow({
  381.             content     : $marker.html()
  382.         });
  383.  
  384.         // show info window when marker is clicked
  385.         google.maps.event.addListener(marker, 'click', function() {
  386.  
  387.             infowindow.open( map, marker );
  388.  
  389.         });
  390.     }
  391.  
  392. }
  393.  
  394. /*
  395. *  center_map
  396. *
  397. *  This function will center the map, showing all markers attached to this map
  398. *
  399. *  @type    function
  400. *  @date    8/11/2013
  401. *  @since   4.3.0
  402. *
  403. *  @param   map (Google Map object)
  404. *  @return  n/a
  405. */
  406.  
  407. function center_map( map ) {
  408.  
  409.     // vars
  410.     var bounds = new google.maps.LatLngBounds();
  411.  
  412.     // loop through all markers and create bounds
  413.     $.each( map.markers, function( i, marker ){
  414.  
  415.         var latlng = new google.maps.LatLng( marker.position.lat(), marker.position.lng() );
  416.  
  417.         bounds.extend( latlng );
  418.  
  419.     });
  420.  
  421.     // only 1 marker?
  422.     if( map.markers.length == 1 )
  423.     {
  424.         // set center of map
  425.         map.setCenter( bounds.getCenter() );
  426.         map.setZoom( 16 );
  427.     }
  428.     else
  429.     {
  430.         // fit to bounds
  431.         map.fitBounds( bounds );
  432.     }
  433.  
  434. }
  435.  
  436. /*
  437. *  document ready
  438. *
  439. *  This function will render each map when the document is ready (page has loaded)
  440. *
  441. *  @type    function
  442. *  @date    8/11/2013
  443. *  @since   5.0.0
  444. *
  445. *  @param   n/a
  446. *  @return  n/a
  447. */
  448.  
  449. $(document).ready(function(){
  450.  
  451.     $('.acf-map').each(function(){
  452.  
  453.         render_map( $(this) );
  454.  
  455.     });
  456.  
  457. });
  458.  
  459. })(jQuery);
  460. </script>
  461. <div class="container-fluid top-spacing">
  462.         <div class="row">
  463.                         <div class="col-md-12 col-sm-12 bottom-spacing">
  464.                 <h2 class="text-center"><?php the_field('map_title','options'); ?></h2>
  465.                 </div>
  466.             <div class="col-md-12">
  467.             <?php
  468.  
  469. $location = get_field('map','options');
  470.  
  471. if( !empty($location) ):
  472. ?>
  473. <div class="acf-map">
  474.     <div class="marker" data-lat="<?php echo $location['lat']; ?>" data-lng="<?php echo $location['lng']; ?>"></div>
  475. </div>
  476. <?php endif; ?>
  477.             </div>
  478.         </div>
  479. </div>
  480. <!--------------------------------Map area end------------------------------------>
  481.  
  482. <!--------------------------------contact area start--------------------------------- -->
  483. <div id="contacts" class="container contact-area">
  484.     <div class="row">
  485.         <div class="col-md-4 col-sm-4 col-xs-12 col-lg-4">
  486.         <h3 class="text-center blue-txt">E-Mail</h3>
  487.         <p class="text-center"><?php the_field('f_email','options'); ?></p>
  488.         </div>
  489.         <div class="col-md-4 col-sm-4 col-xs-12 col-lg-4">
  490.         <h3 class="text-center blue-txt">Call Us</h3>
  491.         <p class="text-center number"><?php the_field('f_call_us','options'); ?></p>
  492.         </div>
  493.         <div class="col-md-4 col-sm-4 col-xs-12 col-lg-4">
  494.         <h3 class="text-center blue-txt">Location</h3>
  495.         <p class="text-center"><?php the_field('f_location','options'); ?></p>
  496.         </div>
  497.     </div>
  498.     </div>
  499.    
  500. <div class="bluelinesel"></div>
  501.     <div id="contacts" class="container contact-area">
  502.     <div class="row">
  503.  
  504. <?php if( have_rows('footer_logos','options') ):
  505.     while ( have_rows('footer_logos','options') ) : the_row(); ?>
  506. <div class="col-md-3 col-sm-3 col-xs-12 col-lg-3">
  507. <img style='float:left; margin-left: 30px;' src="<?php the_sub_field('logo'); ?>" width="<?php the_sub_field('logo_width'); ?>" class="img-responsive  top-spacing" />
  508. </div>
  509.    <?php endwhile; endif; ?>
  510.  
  511.  
  512. </div>
  513. </div>
  514. <!--------------------------------contact area end----------------------------------->
  515.  
  516. <!--------------------------------footer area start--------------------------- -->
  517. <div class="container-fluid footer-area">
  518.     <div class="container">
  519.         <div class="row">
  520.             <div class="col-md-6">
  521.                 <p class="white-txt copy-right">© 2015 Sparkle Wash International</p>
  522.             </div>
  523.             <div class="col-md-6">
  524.                 <ul class="social pull-right">
  525.                     <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/franchise_images/fb.png" class="img-responsive" /></a></li>
  526.                     <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/franchise_images/twiter.png" class="img-responsive" /></a></li>
  527.                     <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/franchise_images/gplus.png" class="img-responsive" /></a></li>
  528.                 </ul>
  529.             </div>
  530.         </div>
  531.     </div>
  532. </div>
  533. <!--------------------------------footer area end--------------------------- -->
  534. <?php wp_footer(); ?>
  535. </body>
  536. </html>
  537.  
  538. <script>
  539. $(window).load(function(){
  540.     var $container = $('.portfolioContainer');
  541.     $container.isotope({
  542.         filter: '.commercial',
  543.         animationOptions: {
  544.             duration: 750,
  545.             easing: 'linear',
  546.             queue: false
  547.         }
  548.     });
  549.  
  550.     $('.portfolioFilter a').click(function(){
  551.         $('.portfolioFilter .current').removeClass('current');
  552.         $(this).addClass('current');
  553.  
  554.         var selector = $(this).attr('data-filter');
  555.         $container.isotope({
  556.             filter: selector,
  557.             animationOptions: {
  558.                 duration: 750,
  559.                 easing: 'linear',
  560.                 queue: false
  561.             }
  562.          });
  563.          return false;
  564.     });
  565. });
  566. </script>
  567.  
  568. <script>
  569. function initialize() {
  570.   var mapProp = {
  571.     center:new google.maps.LatLng(40.805478,-73.96522499999998),
  572.     zoom:5,
  573.     mapTypeId:google.maps.MapTypeId.ROADMAP
  574.   };
  575.   var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
  576. }
  577. google.maps.event.addDomListener(window, 'load', initialize);
  578. </script>
  579. <script>
  580. var fixmeTop = $('.header').offset().top;
  581. $(window).scroll(function() {
  582.     var currentScroll = $(window).scrollTop();
  583.     if (currentScroll >= fixmeTop) {
  584.         $('.header').css({
  585.             position: 'fixed',
  586.             top: '0',
  587.             left: '0',
  588.             transition:'2s',
  589.             width: '100%'
  590.         });
  591.     } else {
  592.         $('.header').css({
  593.             position: 'static',
  594.         });
  595.     }
  596. });
  597. </script>
  598. <script>
  599. $(function() {
  600.   $('a[href*=#]:not([href=#])').click(function() {
  601.     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
  602.       var target = $(this.hash);
  603.       target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
  604.       if (target.length) {
  605.         $('html,body').animate({
  606.           scrollTop: target.offset().top
  607.         }, 1500);
  608.         return false;
  609.       }
  610.     }
  611.   });
  612. });
  613. </script>
  614.  
  615. <script>
  616. $('.owl-carousel2').owlCarousel({
  617.     loop:true,
  618.     margin:10,
  619.     nav:false,
  620.     dot:true,
  621.     autoplay:true,
  622.     responsive:{
  623.         0:{
  624.             items:1
  625.         },
  626.         600:{
  627.             items:1
  628.         },
  629.         1000:{
  630.             items:1
  631.         }
  632.     }
  633. })
  634. </script>
  635. <script>
  636. $('.owl-carousel').owlCarousel({
  637.      margin: 0,
  638.   loop: true,
  639.   items: 1,
  640.   stagePadding: 250,
  641.   nav: false,
  642.   dots:false,
  643.   responsiveClass:true,
  644.     responsive:{
  645.         0:{
  646.             items:1,
  647.             nav:false,
  648.             loop:true,
  649.               stagePadding: 0,
  650.         },
  651.                 1024:{
  652.             items:1,
  653.             nav:false,
  654.             loop:true,
  655.               stagePadding: 100,
  656.                 }
  657.     }
  658. })
  659. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement