[Update]Redmine #649 : Structural change + fixed menu

wp-content/themes/nap/assets/css/main.css

@@ -954,9 +954,7 @@ footer{
 /* ==========================================================================
 VII/ Pages...............ALL pages
 ========================================================================== */
-
 /* --------------*/ /* ---------->>> HOME <<<-----------*/ /* --------------*/
-
 #home {
   position: relative;
   height: 100%;
@@ -970,6 +968,10 @@ VII/ Pages...............ALL pages
 .img-wrapper img{
   display: none;
 }
+#home .img-wrapper.fixed{
+  position: fixed;
+  left: 0;
+}
 .news-btn{
   position: absolute;
   top: 50px;
@@ -1782,7 +1784,7 @@ label.chevron.bottom::first-letter {
 }
 .container-bg{
   position: fixed;
-  z-index: 99;
+  z-index: 9999999;
   background-size: cover;
   opacity: 0;
 }
@@ -2169,6 +2171,9 @@ label.chevron.bottom::first-letter {
   padding: 0px 10px 0px 15px;
   padding-bottom: 100px;
 }
+.right-container .contact-wrapper .right-panel{
+  padding: 0px;
+}
 .panel section > h2{
   padding-top: 80px;
 }
@@ -2295,10 +2300,10 @@ label.chevron.bottom::first-letter {
  padding-top: 30px;
 }
 /* --------------*/ /* ---------->>> Uniqpaper <<<-----------*/ /* --------------*/
-#uniqpaper .cover-wrapper{
+#cat-151 .cover-wrapper{
   top: 0;
 }
-#uniqpaper .right-container .left-panel {
+#cat-151 .right-container .left-panel {
   width: 47.2%;
 }
 .floated-bloc{

wp-content/themes/nap/assets/css/responsive.css

@@ -201,7 +201,7 @@
 		padding: 65px 20px;
 	}
 	/*Uniqpaper*/
-	#uniqpaper .right-container .left-panel {
+	#cat-151 .right-container .left-panel {
 		width: 34%;
 	}
 	.floated-bloc{
@@ -219,6 +219,9 @@
 	.contact-form .footer{
 		padding: 30px 22px 32px;
 	}
+	.right-container .contact-wrapper .right-panel{
+		padding: 0px;
+	}
 	/* Catalogue */
 	.right-container .left-panel{
 		width: 37%;
@@ -288,6 +291,9 @@
 	.right-panel-wrapper{
 		top: 0px !important;
 	}
+	.container-bg{
+		height: auto !important;
+	}
 }
 @media screen and (max-width: 860px) {
 	/* general */
@@ -317,6 +323,12 @@
 	.rounded{
 		padding: 8px 22px 11px;
 	}
+	.mobile-nav{
+		display: none;
+	}
+	#catalogue .mobile-nav{
+		display: block;
+	}
 	/* Helper */
 	.close-btn{
 		top: 15px;
@@ -388,12 +400,12 @@
 		letter-spacing: 0px;
 	}
 	/*Uniqpaper*/
-	#uniqpaper .right-container .left-panel {
+	#cat-151 .right-container .left-panel {
 		position: relative;
 		width: 100%;
 		left: initial !important;
 	}
-	#uniqpaper .cover-wrapper{
+	#cat-151 .cover-wrapper{
 		display: block;
 	}
 	.floated-bloc{

wp-content/themes/nap/assets/js/main.js

@@ -13,14 +13,12 @@ var initFunction = function() {
       $(this).parent().toggleClass('on');
       checkFilterContactWrapper();
     })
-
     //Open Menu
     var toggles = document.querySelectorAll(".c-hamburger");
     for (var i = toggles.length - 1; i >= 0; i--) {
       var toggle = toggles[i];
       toggleHandler(toggle);
-        }
-        ;
+    };
     function toggleHandler(toggle) {
       toggle.addEventListener("click", function(e) {
         var nav = $('.main-nav .nav-content');
@@ -52,13 +50,11 @@ var initFunction = function() {
       });
     }
     $.fn.loadPageContent = function() {
-
       if ($('body').find('header').length > 1) {
         $('body').find('header').last().parent().remove();
         $('.right-panel-wrapper').css('top', $('.nav-header').outerHeight());
         $('html').css('overflow', 'auto');
       }
-
       //$('.load-page').removeClass('fadeOutUp').addClass('animated fadeInUp')
       $('ul.phototheque').find('li').first().addClass('current');
       $('ul.phototheque').find('li').first().find('.subcat').slideDown('slow');
@@ -77,23 +73,14 @@ var initFunction = function() {
       document.getElementById('load-page').addEventListener('scroll', window.scrollAnimation.throttledEvent, false);
       $(document).find('ul.main-list-nav').on('click', ' li.parent-cat>a', function(e) {
         var windowWidth = $(window).width();
+        if (windowWidth > 860) {
           e.preventDefault();
+        }
         e.stopPropagation();
         $('.main-list-nav>li').removeClass('current');
         $(this).parent().addClass('current');
-                //if (windowWidth < 860){
-                //$('.nav-phototeque .nav-content>ul>li').addClass('animated fadeOutLeft');
-                //$('.nav-phototeque .nav-content li.current').removeClass('fadeOutLeft').addClass('fadeInRight');
-                //$('.nav-phototeque .nav-content li.current ul').removeClass('fadeOutLeft').addClass('fadeInRight');
-                //$('.nav-phototeque .nav-content li.current ul').css('display','inline-block !important');
-                //.phototheque-content nav li
-                //}else{
         $('.main-list-nav .subcat').stop().slideUp('slow');
-                // $('.main-list-nav .off .subcat').slideUp();
         $(this).parent().find('.subcat').stop().slideDown('slow');
-
-                //}
-
       });
       setTimeout(function() {
         $('.gallery-wrapper').removeClass('hidden-elem').addClass('animated visible-elem fadeInUp');
@@ -101,13 +88,18 @@ var initFunction = function() {
       }, 100);
     }
     function appendLoading() {
-            $('.load-page').append($('#loading-container-subpage').clone());
+      if (!($('body #loading-container-subpage').length)) {
+        $('.load-page, .right-container').append($('#loading-container-subpage').clone());
+      }
       $('#loading-container-subpage').show();
     }
     //load content page on left Panel
     $(document).find('.to-slide').on('click', 'a', function(e) {
-            $('html').css('overflow', 'hidden');
-            appendLoading();
+      if (!($('.load #loading-container-subpage').length)) {
+        $('.load-page').append($('#loading-container-subpage').clone());
+      }
+      $('#loading-container-subpage').show();
+
       e.preventDefault();
       var link = $(this).attr("href"),
       windowWidth = $(window).width();
@@ -117,31 +109,86 @@ var initFunction = function() {
           'left': $('.nav-wrapper').outerWidth()
         });
         $('.load-page').css('opacity', 1);
-                $(document).find('#loading-container-subpage').css({
-                    'left': $('.nav-wrapper').outerWidth(),
-                    'width': 'calc(100% - ' + $('.nav-wrapper').outerWidth() + 'px)',
-                })
-                /**/
-                $('nav ul li').removeClass('current').addClass('off');
-                $(this).parent().addClass('current');
-
-                /**/
       } else {
         $('.load-page').parent().css({
           'left': 0,
         });
         $('.load-page').parent().addClass('active');
       }
-            history.pushState(null, null, link);
       $('.load-page').load(link, {'ajax': 1}, function() {
         $.fn.loadPageContent();
         $.fn.responsive();
         $.fn.animation();
+        $('.loading-container-subpage').hide();
       });
+      history.pushState(null, null, link);
+      $('html').css('overflow', 'hidden');
       if (windowWidth < 860) {
         $(".c-hamburger").trigger("click");
       }
     });
+    //function slideContentPage(){
+    $(document).find('.to-slide-cat').on('click', 'a', function(e) {
+      var windowWidth = $(window).width();
+      if (windowWidth > 860){
+        e.preventDefault();
+      }
+      var link = $(this).attr("href");
+      if (!($('.right-container #loading-container-subpage').length)) {
+        $('.right-container').append($('#loading-container-subpage').clone());
+      }
+      $('#loading-container-subpage').show();
+      $('.right-container').find('#loading-container-subpage').css({
+        'left': $('.nav-wrapper').outerWidth(),
+        'width': 'calc(100% - ' + $('.nav-wrapper').outerWidth() + 'px)',
+      })
+      $(this).parent().find('.subcat').addClass('current');
+      $('.img-wrapper').hide();
+      /*  $('nav ul').each(function(){
+      $(this).find('li').removeClass('current').addClass('off');
+    })*/
+    var clickedElem = $(this).parent();
+    $('.right-container').load(link, {'ajax': 1}, function() {
+      // $('#fullpage').fullpageSlide(); //Stories
+      // $('.filter-wrapper').open_filter();
+      var dataElem = $(document).find(".data-elem");
+      var postId = dataElem.data('postid');
+      var page = dataElem.data('page');
+      $('.main .container').attr({
+        'id':postId,
+        'data-page': page,
+      });
+      $('.right-container').addClass(dataElem.data('class'));
+      $('.main').on("scroll", onScroll);
+      loadCatalogContainer();
+      $('nav ul li').removeClass('current').addClass('off');
+      $('.subcat').removeClass('current');
+      $('.subcat').hide();
+      clickedElem.addClass('current');
+      clickedElem.find('.subcat').addClass('current');
+      clickedElem.find('.subcat').slideDown();
+      $.fn.getMenuBg(); //Animation BG Menu
+      //Load on home page
+      if ($('body #home').length) {
+        $('#home').find('.img-wrapper').addClass('fixed');
+        $('#home').find('.img-wrapper').css({
+          'width' : $('.nav-wrapper').outerWidth(),
+        })
+        $('#home').addClass('container clearfix');
+        if ($('body .catlog-panel').length) {
+          $('#home').attr('id','catalogue');
+        }else{
+          $('#home').attr('id','');
+        }
+        $('.main .container-bg').removeClass('hidden');
+        //$('.main').css('padding-top', $('.nav-header').outerHeight());
+      }
+      $('.loading-container-subpage').hide();
+    });
+    history.pushState(null, null, link);
+  });
+  //}
+
   var div = $('.nav-content');
   $('.footer-home-content').on('click', '.home-down:not(.scrolled)', function(e) {
     TweenMax.killTweensOf('.nav-content');
@@ -152,16 +199,11 @@ var initFunction = function() {
       $('.main').outerHeight(mainHeight + $('.footer-home-content').outerHeight());
       $('.home-down-wrapper').css('top', -($('.home-down-wrapper').outerHeight()));
       $('.home-down').css('top', -($('.home-down').outerHeight()));
-
-                //$('.home-down-wrapper').css('top','121px');
     }
     //scroll to bottom
     $('body').animate({
       scrollTop: div.outerHeight()
-            }, 1000, 'swing', function() {
-
-            });
-
+    }, 1000, 'swing', function() {});
   }).on('click', '.scrolled', function() {
     $(this).removeClass('scrolled');
     $("html, body").animate({scrollTop: 0}, "slow");
@@ -173,13 +215,13 @@ var initFunction = function() {
     }, 600)
     return false;
   });
-//Get file name of uploaded file
+  //Get file name of uploaded file
   $('#file-p').on('change', function(e) {
     var fileName = e.target.files[0].name;
     $('.upload-btn').after($('<p class="loaded-file">' + fileName + '</p>'));
   })
-//END get file name
-//END load content page on left Panel
+  //END get file name
+  //END load content page on left Panel
   $(document).on('click', '.int-link', function(e) {
     e.preventDefault();
     $('.load-page').parent().removeClass('active');
@@ -199,9 +241,8 @@ var initFunction = function() {
     // $('#user_login').attr('placeholder', 'Identifiant');
     // $('#user_pass').attr('placeholder', 'Mot de passe');
     $('.popup-first').removeClass('fadeOutDown ').addClass('animated visible-elem pulse');
-
   });
-//Close popup
+  //Close popup
   $('.popup-first .close-btn').click(
     function() {
       $('.popup-first').removeClass('visible-elem pulse').addClass('fadeOutDown');
@@ -216,7 +257,7 @@ var initFunction = function() {
       }
       return color;
     }
-//checkWhiteColor = function(item) {
+    //checkWhiteColor = function(item) {
     $.fn.setColorToWhite = function(item) {
       //$('.list-wrapper .color-list')
       $(this).each(function() {
@@ -228,7 +269,6 @@ var initFunction = function() {
         }
       });
     }
-
     $.fn.setBgColorList = function() {
       $(this).each(function() {
         $(this).css({
@@ -249,7 +289,7 @@ var initFunction = function() {
       });
       $('.product-list article ul li').setBgColorList();
     }
-//FadeIn Image on home page
+    //FadeIn Image on home page
     $.fn.fadeImage = function() {
       var srcImage = $(this).data('img');
       if (srcImage == 'undefined' || !srcImage)
@@ -275,7 +315,7 @@ var initFunction = function() {
       $('header nav').find('ul li').find("[data-page=" + currentPage + "]").slideDown();
       $('header nav').find('ul').find("[data-page=" + currentPage + "]").addClass('current');
     }
-//animate menu nav
+    //animate menu nav
     $.fn.open_nav = function() {
       TweenLite.set(".nav-content", {visibility: "visible"});
       var tl = new TimelineMax();
@@ -311,7 +351,6 @@ var initFunction = function() {
         tlFilter.staggerFromTo('.filter-bloc', 0.5, {opacity: 0, y: 100}, {opacity: 1, y: 0}, 0.1, 0);
         tlFilter.fromTo('.filter-list', 0.5, {opacity: 0, left: '0', visibility: "hidden"}, {opacity: 1, left: mainW, visibility: "visible"}, 0);
         tlFilter.to('.filter-btn .btn-container', 0.5, {opacity: 0, left: filterW, width: "0px"}, 0);
-
         //tl.fromTo('#slides',0.5,{opacity:1},{opacity:0},0);
         //tl.fromTo('.nav-slider',0.5,{opacity:1},{opacity:0},0);
       }).on('click', '.close-btn', function() {
@@ -380,6 +419,10 @@ var initFunction = function() {
           $('.moveDown').removeClass('hidden-elem').addClass('visible-elem animated rollIn');
         }, 2000);
         $("#fullpage .section").first().addClass('first');
+        //destroying
+        if (typeof $.fn.fullpage.destroy == 'function') {
+          $.fn.fullpage.destroy('all');
+        }
         $(this).fullpage({
           verticalCentered: false,
           css3: false,
@@ -393,8 +436,8 @@ var initFunction = function() {
           afterLoad: function(anchor, index) {
             tl1 = new TimelineMax();
             var firstSection = $("#fullpage .section.first");
-//tl1.animatePageScroll(firstSection,duration);
-//console.log(animation);
+            //tl1.animatePageScroll(firstSection,duration);
+            //console.log(animation);
             tl1.fromTo(firstSection.find('.bloc .header-bloc'), 1.5,
             {opacity: 0, visibility: "hidden", marginBottom: '80px'},
             {opacity: 1, visibility: "visible", marginBottom: '0px'}, timeout);
@@ -473,7 +516,7 @@ var initFunction = function() {
         }, 2000)
 
       }
-//Responsive function
+      //Responsive function
       $.fn.responsive = function() {
         $(".product-details").css('height', 'auto');
         var footerHeight = $('footer').height(),
@@ -516,6 +559,7 @@ var initFunction = function() {
         if (windowWidth > 860) {
           $('#fullpage .chevron').css('left', navMenuWidth);
           $('.container-bg').css({'height': '100%', 'width': navMenuWidth});
+          //  $.fn.getMenuBg();
           $('.main').css('padding-top', 0);
           $('.contact-form h2').removeClass('show-comm');
           $('.filter, .left-panel .map, .details, .contact-form form').show();
@@ -550,7 +594,7 @@ var initFunction = function() {
         }
         checkFooterNavPosition();
       }
-//Wordpress js login
+      //Wordpress js login
       $('#user_login').attr('placeholder', 'Identifiant');
       $('#user_pass').attr('placeholder', 'Mot de passe');
       $("#user_login").addClass("my-login-username");
@@ -638,7 +682,6 @@ var initFunction = function() {
         else
         margin_top = 50;
         if (refElement.length && refElement.position().top - ($(".main").outerHeight() / 2 - titleHeight - $(".footer").outerHeight() - margin_top) <= scrollPos && refElement.position().top + refElement.height() > scrollPos) {
-
           $('.subcat a').removeClass("active");
           currLink.addClass("active");
           if ($('nav ul ul').find('li.active')) {
@@ -680,7 +723,6 @@ var initFunction = function() {
           });
         });
       })
-
     }
     function checkFooterNavPosition() {
       var mainHeight = $('.main-nav .nav-content').height(),
@@ -712,6 +754,30 @@ var initFunction = function() {
         }
       }, 500)
     }
+    function loadCatalogContainer(){
+      // Catalog Page : Change product image depending on selected color
+      $('.product-list article ul li').on('mouseover', function() {
+        $(this).changeProductImageBg();
+      });
+      $('.product-list article').each(function() {
+        $(this).showProductListColors();
+      });
+      $('.filter-bloc .list-color-filter li').setColorToWhite();
+      $('.filter-wrapper').open_filter();
+      $.fn.checkSelectedFilter();
+      $.fn.showSubmenu(); //Catalog subMenu
+      setTimeout(function() {
+        onScrollCover();
+      }, 500);
+      $('#fullpage').fullpageSlide(); //Stories
+      $.fn.responsive();
+      $('.list-color-filter li').setBgColorList();
+      $.fn.animation(); //Global animation for entire site
+      //TODO
+      $('.cover-wrapper').last().addClass('last');
+      $('.cover-wrapper').first().addClass('first');
+      showMap();
+    }
     $(window).load(function() {
       initFunction();
       $('.header .nav-wrapper .nav-content > ul > li').each(function() {
@@ -733,26 +799,13 @@ var initFunction = function() {
           $('.home-footer-nav .nav-wrapper').removeClass('fixed');
         }
       }
-
     });
-//$(window).bind("scrollStop",onScroll)
+    //$(window).bind("scrollStop",onScroll)
     $(document).ready(function() {
       $(document).on('mouseover', '.nav-content li', function() {
         $(this).stop(false, true).fadeImage();
       });
-        // Catalog Page : Change product image depending on selected color
-        $('.product-list article ul li').on('mouseover', function() {
-            $(this).changeProductImageBg();
-        });
-        $('.product-list article').each(function() {
-            $(this).showProductListColors();
-        });
-        $('.filter-bloc .list-color-filter li').setColorToWhite();
-        setTimeout(function() {
-            onScrollCover();
-        }, 330);
       $.fn.open_nav();
-
       if ($(document).find('#load-page').children().length) {
         scrollAnchor("#load-page", true);
       } else {
@@ -760,18 +813,8 @@ var initFunction = function() {
       }
       $('.news-btn').open_news();
       $('.close-btn').close_news();
-        $('.filter-wrapper').open_filter();
-        $.fn.checkSelectedFilter();
-        $.fn.showSubmenu(); //Catalog subMenu
-        $('#fullpage').fullpageSlide(); //Stories
-        $.fn.responsive();
-        $('.list-color-filter li').setBgColorList();
-        $.fn.animation(); //Global animation for entire site
+      loadCatalogContainer(); // Load functions catalog page
       $.fn.getMenuBg(); //Animation BG Menu
-        //TODO
-        $('.cover-wrapper').last().addClass('last');
-        $('.cover-wrapper').first().addClass('first');
-        showMap();
       $.fn.loadPageContent();
     }); //end document ready
 
@@ -783,8 +826,4 @@ var initFunction = function() {
       document.body.removeChild(load_screen);
     });
 
-
-
-
-
-}(jQuery));
+  }(jQuery));

wp-content/themes/nap/assets/js/nap.js

@@ -110,13 +110,13 @@ jQuery(document).ready(function() {
 
 
 
-jQuery(window).bind("popstate", function(e) {
+/*jQuery(window).bind("popstate", function(e) {
     var state = e.originalEvent.state;
     if ( state === null ) {
         var back_link = jQuery('.close-panel .circle-btn a').attr('href');
        window.location.href = back_link;
     }
-});
+});*/
 
 });
 

wp-content/themes/nap/contact.php

 <?php
 /**
- * Template Name: Contact
- *
- */
-get_header();
+* Template Name: Contact
+*
+*/
 $post_ID = 157;
+if (!(isset($_POST['ajax']))) {
+  get_template_part( 'header', 'page-content' );
+}
 ?>
-
-<div class="container clearfix" id="contact" data-page = "contact">
-    <div class="container-bg abs-full"></div>
-    <?php get_sidebar(); ?>
-    <div class="contact-wrapper">
-        <div class="right-container">
+<div class="hidden data-elem" data-postid ="cat-<?php echo $post_ID ?>" data-page = "<?php echo $post_ID ?>"></div>
+<div class="contact-wrapper">
   <div class="left-panel fixed-full position--after-menu ">
     <div class="map">
       <object id="map" type="image/svg+xml" data="<?php echo home_url('wp-content/themes/nap/assets/css/img/departements2.svg') ?>"></object>
     </div>
   </div>
-        </div>
   <div class="right-panel full-height right">
     <div class="filter-wrapper search-filter fixed full-height form-wrapper border-l row">
       <div class="header-filter-contact">
@@ -28,7 +25,6 @@ $post_ID = 157;
         <form id="map-search" method="get" action='contact.php'>
           <p class="form-element">
             <span class = "chevron bottom"></span>
-
             <select id="selectCountry" >
               <?php
               if (get_field('contact_pays', $post_ID)):
@@ -42,16 +38,13 @@ $post_ID = 157;
               endif;
               ?>
             </select>
-
           </p>
           <p class="form-element cp">
             <input placeholder="Code postal" class="search" id="search" type="text" name="search">
             <input class ="search-btn" type="submit" />
           </p>
-
         </form>
       </div>
-
       <?php
       if (get_field('zones_commerciaux', $post_ID)):
         $i = 0;
@@ -61,7 +54,6 @@ $post_ID = 157;
             <figure style="background-image:url(<?php the_sub_field('photo_commercial'); ?>)"></figure>
             <?php the_sub_field('infos_commercial'); ?>
           </div>
-
           <?php
           // list zones par commercial
           if (get_sub_field('list_zones', $post_ID)):
@@ -93,10 +85,8 @@ $post_ID = 157;
             <figure style="background-image:url(<?php echo get_field('photo_groupement', $post_ID) ?>)"></figure>
             <?php echo get_field('contact_groupement', $post_ID) ?>
           </div>
-
         </div>
       </div>
-
     </div>
     <div class="contact-form right border-l row gray-bg">
       <div class="form-wrapper inner-form">
@@ -104,23 +94,6 @@ $post_ID = 157;
           <h2>Je souhaite être <br> contacté</h2>
           <span class="open-filter abs-full display--only-mobile"></span>
         </div>
-                    <!--<form method="POST">    
-                        <div class="clearfix">
-                            <div class="row left half-col">
-                                <input placeholder = "Nom" type="text" name="name" id="name" value="" />
-                                <input placeholder = "Prénom" type="text" name="fname" id="fname" value="" />
-                            </div>
-                            <div class="row right half-col">
-                                <input placeholder = "Mail" type="text" name="mail" id="mail" value="" />
-                                <input placeholder = "Téléphone" type="text" name="phone" id="phone" value="" />
-                            </div>
-                            <textarea name="message" id="message" title="Message" placeholder="Message"></textarea>
-                        </div>
-                        <input type = "submit" class="btn pink-btn rounded" value = 'Envoyer'>
-
-
-
-                    </form>-->
         <?php echo do_shortcode( '[contact-form-7 id="558" title="Contact form"]' ); ?>
       </div>
       <div class="footer blue-bg abs font-small">
@@ -136,6 +109,9 @@ $post_ID = 157;
       </div>
     </div>
   </div>
-    </div>
 </div>
-<?php get_footer(); ?>
+<?php
\ No newline at end of file
+if (!(isset($_POST['ajax']))) {
+  get_template_part( 'footer', 'page-content' );
+}
+?>

wp-content/themes/nap/footer-page-content.php

+</div> <!-- END right-container -->
+<?php
+if (!(isset($_POST['ajax']))) {
+  get_footer();
+} ?>

wp-content/themes/nap/footer.php

@@ -63,7 +63,7 @@
         </div>
     </div>
 </div>
-<div id="loading-container-subpage">
+<div id="loading-container-subpage" class = "loading-container-subpage">
 	<div class="loading-wrapper">
 		<div class="loading">
 			<div id="loading-center-absolute">

wp-content/themes/nap/front-page.php

 <?php
 get_header();
-get_sidebar();
+
 $url =  nap_attachment_image($ID);
 ?>
 <div id="home">
+	<div class="container-bg abs-full hidden"></div>
+	<?php get_sidebar(); ?>
 	<div data-defaultimg ='<?php echo $url ;?>' class="transition img-wrapper" style ="background-image: url('<?php echo $url ;?>')"></div>
+
+
+		<div class="header mobile-nav display--only-mobile blue-bg fixed">
+			<div class="nav-wrapper blue-bg">
+				<ul></ul>
+			</div>
+		</div>
+
+
+
+	<div class="right-container">
 	<div class="news-btn circle-btn add-icon font-small animated zoomIn"><span>Nouveautés</span></div>
 	<aside class="news-wrapper container ">
 		<div class="news-header crete">
@@ -31,7 +44,6 @@ $url =  nap_attachment_image($ID);
 				endwhile;
 			endif;
 			?>
-
 		</div>
 	</aside>
 	<!--Menu for mobile-->
@@ -43,8 +55,9 @@ $url =  nap_attachment_image($ID);
 			</div>
 		</div>
 	</div>
-	</div><!--END home -->
-	<?php
+</div><!--END home -->
+</div>
+<?php
 
 
-	get_footer();
+get_footer();

wp-content/themes/nap/functions.php

@@ -310,7 +310,7 @@ function nap_menu() {
             } else {
                 $nappe_sets = false;
             }
-            $menu.= '<li class ="parent-cat to-slide" data-page = "' . $category_id . '" data-img = "' . nap_category_image($category_id) . '"><a href="' . get_term_link($cat->slug, 'product_cat') . '">' . $cat->name . '</a>';
+            $menu.= '<li class ="parent-cat to-slide-cat" data-page = "' . $category_id . '" data-img = "' . nap_category_image($category_id) . '"><a href="' . get_term_link($cat->slug, 'product_cat') . '">' . $cat->name . '</a>';
 
             $args2 = array(
                 'taxonomy' => $taxonomy,

wp-content/themes/nap/header-page-content.php

+<?php
+if (!defined('ABSPATH')) {
+  exit; // Exit if accessed directly
+}
+if (!(isset($_POST['ajax']))) {
+  get_header();
+}
+
+$product;
+$cate = get_queried_object();
+$extClass = "";
+if (is_product_category()){
+  $cateID = $cate->term_id;
+  $id = "catalogue";
+}else{
+  $cateID = get_the_ID();
+  $id = 'cat-'.$cateID;
+}
+if ($cateID == 154){ //page stories
+  $extClass = "full-slides  right";
+}
+?>
+<div class="container clearfix" id="<?php echo $id ?>" data-page = "<?php echo $cateID; ?>">
+  <?php if (!(isset($_POST['ajax']))) { ?>
+    <?php if ($cateID == 154){ //page stories ?>
+      <div class="container-bg abs-full" style="background-image: url('<?php echo nap_attachment_image(154);?>')"></div>
+    <?php } else { ?>
+      <div class="container-bg abs-full"></div>
+    <?php } ?>
+    <?php  get_sidebar(); } ?>
+    <?php if (is_product_category()){ ?>
+      <div class="header mobile-nav display--only-mobile blue-bg fixed">
+        <div class="nav-wrapper blue-bg">
+          <ul></ul>
+        </div>
+      </div>
+    <?php } // is_product_category ?>
+    <div class="right-container <?php echo $extClass ?>">

wp-content/themes/nap/header.php

@@ -32,4 +32,3 @@
     </div>
 </div>
 <div class="main">
-

wp-content/themes/nap/nav-list.php

@@ -5,17 +5,14 @@
     $arrow = 'arrow-blue phototheque';
   }
   ?>
-
   <ul class = "main-list-nav <?php echo $arrow ?>">
-
     <?php  echo nap_menu(); ?>
-
-        <li class="to-slide" data-page = "uniqpaper" data-img = "<?php echo nap_attachment_image(151);?>"><a href="<?php echo get_permalink(151);?>">Personnalisation</a></li>
+    <li class="to-slide-cat" data-page = "151" data-img = "<?php echo nap_attachment_image(151);?>"><a href="<?php echo get_permalink(151);?>">Personnalisation</a></li>
   </ul>
-<?php if (!(isset($current_page) and $current_page == 'phototheque')) { ?>
+  <?php if (!(isset($current_page) and $current_page == 'phototheque')) { ?>
     <ul class= "font-medium arrow-pink pink-list">
-            <li class="to-slide" data-page = "stories" data-img = "<?php echo nap_attachment_image(154);?>"><a href="<?php echo get_permalink(154);?>">Stories</a></li>
-            <li class="to-slide" data-page = "contact" data-img = "<?php echo nap_attachment_image(157);?>" ><a href="<?php echo get_permalink(157);?>">Contact</a></li>
+      <li class="to-slide-cat" data-page = "154" data-img = "<?php echo nap_attachment_image(154);?>"><a href="<?php echo get_permalink(154);?>">Stories</a></li>
+      <li class="to-slide-cat" data-page = "157" data-img = "<?php echo nap_attachment_image(157);?>" ><a href="<?php echo get_permalink(157);?>">Contact</a></li>
     </ul>
-<?php } ?>
+  <?php } ?>
 </div>

wp-content/themes/nap/stories.php

 <?php
 /**
- * Template Name: Stories
- *
- */
-get_header();
+* Template Name: Stories
+*
+*/
+$post_ID = get_the_ID();
+if (!(isset($_POST['ajax']))) {
+  get_template_part( 'header', 'page-content' );
+}
 ?>
-<div class="container clearfix" data-page = "stories">
-    <div class="container-bg abs-full" style="background-image: url('<?php echo nap_attachment_image(154);?>')"></div>
-<?php get_sidebar(); ?>
-    <div class="full-slides right-container right">
-        <div id="fullpage">
+<div class="hidden data-elem" data-postid ="cat-<?php echo $post_ID ?>" data-page = "<?php echo $post_ID ?>" data-class="full-slides  right"></div>
+<div id="fullpage">
   <span class = "moveDown chevron bottom hidden-elem"></span>
   <?php
   if (get_field('stories', 154)):
-
     while (has_sub_field('stories', 154)) :
       ?>
       <div class="section " style = "background-image:url('<?php the_sub_field('st_image'); ?>')">
@@ -32,10 +31,9 @@ get_header();
     endwhile;
   endif;
   ?>
-
-
-        </div>
-    </div>
 </div>
 <?php
-get_footer();
+if (!(isset($_POST['ajax']))) {
+  get_template_part( 'footer', 'page-content' );
+}
+?>

wp-content/themes/nap/uniqpaper.php

 <?php
 /**
- * Template Name: Personnalisation
- *
- */
-get_header(); ?>
-<div class="container clearfix" id="uniqpaper" data-page = "uniqpaper">
-	<div class="container-bg abs-full"></div>
-	<?php get_sidebar(); ?>
-	<div class="right-container">
-		<div class="left-panel fixed-full position--after-menu ">
+* Template Name: Personnalisation
+*
+*/
+$post_ID = get_the_ID();
+if (!(isset($_POST['ajax']))) {
+	get_template_part( 'header', 'page-content' );
+}
+?>
+<div class="hidden data-elem" data-postid ="cat-<?php echo $post_ID ?>" data-page = "<?php echo $post_ID ?>"></div>
+<div class="left-panel fixed-full position--after-menu ">
 	<div class="cover-wrapper abs-full transition" style = "background-image: url('<?php echo get_field('pers_image',151)?>')"></div>
 	<div class="abs floated-bloc">
 		<h2><?php echo get_field('pers_titre',151)?></h2>
 		<div class="text-content"><?php echo get_field('pers_texte',151)?></div>
 	</div>
-		</div>
-	</div>
-	<div class="right-panel right">
+</div>
+<div class="right-panel right">
 	<div class="form-wrapper clearfix">
-			<!--<form action="#" method="POST">
-				<h2>Information sur le produit</h2>
-				<textarea name = "description" placeholder="Describe yourself here..."> </textarea>
-				<h2>Vos coordonnées</h2>
-				<div class="clearfix">
-					<div class="row left half-col">
-						<input placeholder = "Nom" type="text" name="name" id="name" value="" />
-						<input placeholder = "Prénom" type="text" name="fname" id="fname" value="" />
-						<input placeholder = "Société" type="text" name="soc" id="soc" value="" />
-					</div>
-					<div class="row right half-col">
-						<input placeholder = "Mail" type="text" name="mail" id="mail" value="" />
-						<input placeholder = "Téléphone" type="text" name="phone" id="phone" value="" />
-					</div>
-				</div>
-				<div class="center">
-					<input type = "submit" class="btn pink-btn rounded" value = 'Envoyer'>
-				</div>
-			</form>-->
 		<?php echo do_shortcode( '[contact-form-7 id="663" title="Personnalisation form"]' ); ?>
 	</div>
-	</div>
-
 </div>
-<?php get_footer();
+<?php
\ No newline at end of file
+if (!(isset($_POST['ajax']))) {
+	get_template_part( 'footer', 'page-content' );
+}
+?>

wp-content/themes/nap/woocommerce/archive-product.php

 <?php
 //print_r($_GET);
 /**
- * The Template for displaying product archives, including the main shop page which is a post type archive
- *
- * This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.
- *
- * HOWEVER, on occasion WooCommerce will need to update template files and you
- * (the theme developer) will need to copy the new files to your theme to
- * maintain compatibility. We try to do this as little as possible, but it does
- * happen. When this occurs the version of the template file will be bumped and
- * the readme will list any important changes.
- *
- * @see         https://docs.woocommerce.com/document/template-structure/
- * @author      WooThemes
- * @package     WooCommerce/Templates
- * @version     2.0.0
- */
-if (!defined('ABSPATH')) {
-    exit; // Exit if accessed directly
-}
-$current_page = 'catalogue';
+* The Template for displaying product archives, including the main shop page which is a post type archive
+*
+* This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.
+*
+* HOWEVER, on occasion WooCommerce will need to update template files and you
+* (the theme developer) will need to copy the new files to your theme to
+* maintain compatibility. We try to do this as little as possible, but it does
+* happen. When this occurs the version of the template file will be bumped and
+* the readme will list any important changes.
+*
+* @see         https://docs.woocommerce.com/document/template-structure/
+* @author      WooThemes
+* @package     WooCommerce/Templates
+* @version     2.0.0
+*/
+?>
+<?php
+$product;
+$cate = get_queried_object();
 if (!(isset($_POST['ajax']))) {
-  get_header();
+  set_query_var( 'cateID',$cate->term_id);
+  get_template_part( 'header', 'page-content' );
 }
-
+$current_page = 'catalogue';
 $product;
 $cate = get_queried_object();
 $cateID = $cate->term_id;
-
 //SubCats
 # JC 20170901
 #$child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of' => the_category_ID(), 'exclude' => $cateID, 'orderby' => 'title', 'order' => 'ASC'));
 $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of' => the_category_ID(), 'exclude' => $cateID, 'orderby' => 'meta_value_num', 'meta_key' => 'order', 'order' => 'ASC'));
 # JC 20170901 end
 ?>
-
-<div class="container clearfix" id="catalogue" data-page = "<?php echo $cateID; ?>">
-  <?php if (!(isset($_POST['ajax']))) { ?>
-    <div class="container-bg abs-full"></div>
-    <?php  get_sidebar(); } ?>
-    <div class="header mobile-nav display--only-mobile blue-bg fixed">
-        <div class="nav-wrapper blue-bg">
-            <ul></ul>
-        </div>
-    </div>
-    <div class="right-container">
-        <div class="left-panel fixed-full position--after-menu ">
+<div class="left-panel fixed-full position--after-menu catlog-panel">
   <?php if ($cateID != 20): ?>
     <div class="filter-wrapper">
       <div class="filter-btn fixed position--after-menu">
@@ -98,12 +87,9 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
                           $filter_format = nap_selected_filter($_GET['pa_format'], $term);
                           $filter_matiere = nap_selected_filter($_GET['pa_matiere'], $term);
                           $filter_univers = nap_selected_filter($_GET['pa_univers'], $term);
-
                           ?>
-
                           <li class="<?php echo $filter_format . ' ' . $filter_matiere .' '.$filter_univers ?>"><?php echo $term; ?></li>
                           <?php
-
                         endif;
                       endforeach;
                       foreach (array_unique($colors) as $name => $code) {
@@ -116,18 +102,13 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
                       }
                       if ($value == 'pa_couleur'):
                         ?>
-
                         <li class="reinit">Tout déselectionner</li>
                       <?php endif; ?>
                     </ul>
-
                   </div>
                 <?php endif; ?>
               </div>
             <?php endforeach; ?>
-
-
-
             <div class="center filter-btn-list">
               <div class="btn pink-btn rounded" id="search-btn">Rechercher</div>
               <span class = "reinit-all">Effacer les filtres</span>
@@ -154,11 +135,8 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
     <div class="panel panel-content list-animation">
       <?php if ($_GET['pa_couleur'] != '' || $_GET['pa_format'] != '' || $_GET['pa_matiere'] != '' || $_GET['pa_univers'] != '' || $_GET['sku'] != ''): ?>
         <span  class="search_result">Résultat de votre recherche :<span class="search_notfound" style="color:#ff6a5f"></span></span>
-
       <?php endif; ?>
-
       <?php foreach ($child_category as $key => $value) : ?>
-
         <section id = "cat<?php echo $value->term_id ?>">
           <h2 class="crete small-title"><?php echo $value->name ?></h2>
           <div class="cover-mobile display--only-mobile animated fadeInUp" style = "background-image: url('<?php echo nap_category_image($value->term_id) ?>')">
@@ -174,11 +152,9 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
             # JC 20170901 end
             $naps_posts = new WP_Query($args);
             $options = array();
-
             while ($naps_posts->have_posts()) : $naps_posts->the_post();
             $id = get_the_ID();
             $list_att = array();
-
             $options['size'] = (get_field('produit_affichage', $id)) ? get_field('produit_affichage', $id) : 'small';
             $args = array(
               'post_type' => array('product', 'product_variation'),
@@ -192,16 +168,12 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
             $attribute_value['pa_format'] = get_the_terms($id, 'pa_format');
             $attribute_value['pa_matiere'] = get_the_terms($id, 'pa_matiere');
             $attribute_value['pa_univers'] = get_the_terms($id, 'pa_univers');
-
-
             //var_dump($attribute_value['pa_format']);
-
             if (is_array($attribute_value['pa_format'])) {
               $list_formats ='';
               foreach ($attribute_value['pa_format'] as $key => $value) {
                 $list_formats .= $value->name.',';
               }
-
               $list_att['pa_format'] = explode(',',$list_formats);
             }
 
@@ -214,16 +186,13 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
                 }
                 $list_att['pa_couleur'] = explode(',',$list_couleurs);
               }
-
               if (is_array($attribute_value['pa_format'])) {
                 $list_formats ='';
                 foreach ($attribute_value['pa_format'] as $key => $value) {
                   $list_formats .= $value->name.',';
                 }
-
                 $list_att['pa_format'] = explode(',',$list_formats);
               }
-
               if (is_array($attribute_value['pa_matiere'])) {
                 foreach ($attribute_value['pa_matiere'] as $key => $value) {
                   $list_att['pa_matiere'] = $value->name;
@@ -234,7 +203,6 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
                   $list_att['pa_univers'] = $value->name;
                 }
               }
-
               nap_filter_attribute($id, $args, $options, $list_att, $_GET);
             } else {
               echo nap_get_item($id, $args, $current_page, $options);
@@ -246,10 +214,9 @@ $child_category = get_terms('product_cat', array('parent' => $cateID, 'child_of'
       </section>
     <?php endforeach; ?>
   </div>
-        </div>
-    </div>
 </div>
 <?php
 if (!(isset($_POST['ajax']))) {
-  get_footer();
-} ?>
+  get_template_part( 'footer', 'page-content' );
+}
+?>