Hi I was wondering if anyone could help.
I'm creating a site using JointsWP Foundation 6 theme and have created a new fixed side menu which includes the logo and social links. My problem is everytime a user click on the menu it reloads causing a shift - is there a way of stopping this - is it a page load issue or have i come about it the wrong way? I tried adding a caching plugin but it hasn't seemed to help. Any suggestions appreciated.
Here is examples of my code:
<body <?php body_class(); ?>>
<div class="off-canvas-wrapper">
<?php get_template_part( 'parts/content', 'offcanvas' ); ?>
<div class="off-canvas-content" data-off-canvas-content>
<header class="header show-for-small-only" role="banner">
<!-- This navs will be applied to the topbar, above all content
To see additional nav styles, visit the /parts directory -->
<?php get_template_part( 'parts/nav', 'offcanvas-topbar' ); ?>
</header> <!-- end .header -->
<!-- THE NEXT PART HAS BEEN MOVED FROM THE TOP OF THE PAGE.PHP -->
<div id="content">
<div id="inner-content" class="row expanded">
<div class="medium-3 columns show-for-medium" data-sticky-container>
<div class="sticky" data-sticky data-margin-top="0">
<!-- LOGO HERE -->
<div class="row logo">
<div class="medium-10 columns">
<img src="<?php echo get_site_url(); ?>/wp-content/themes/JointsWP-CSS-master/assets/images/logo.png" alt="big green space"/>
</div>
</div>
<div class="row verticalMenu">
<!-- VERTICAL MENU HERE -->
<?php joints_top_nav(); ?>
</div>
<div class="row socialR">
<p>
<i class="fa fa-facebook-square" aria-hidden="true"></i><i class="fa fa-linkedin-square" aria-hidden="true"></i>
<br/>
t: +44 000 000000<br/>
e: [email protected]</p>
</div>
</div>
</div>
and the page.php
<?php get_header(); ?>
<div id="inner-content" class="row">
<div class="medium-4 columns show-for-medium"> -->
<!-- LOGO HERE -->
<!-- VERTICAL MENU HERE -->
<!-- </div> -->
<main id="main" class="large-9 medium-9 columns contentSection" role="main">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php get_template_part( 'parts/loop', 'page' ); ?>
<?php endwhile; endif; ?>
<!--</main> <!-- end #main -->
<!--</div> <!-- end #inner-content -->
<!--</div> <!-- end #content -->
Edit:
i have added 2 test pages so that you can see - biggreenspace.com/test-page-1 and you will be able to navigate to test page 2 (the other menu will take you to the maintenance screen). This primarily happens in Chrome and Firefox - not in IE edge.
