Hello,
My site seethereviews.com is set up for One Page Nav, but it only works in Safari, not in Chrome or Firefox.
This is what I’ve done to debug:
I’m having the same issue with the scroll-to-top button as well.
I really appreciate any help you can give me.
Hi there,
Thanks for writing around! I checked your site and I see custom JS in you Customizer, please remove all of your scripts ( make sure to take a backup of your scripts ) and add the following script:
jQuery(document).ready(function($) {
var $body = $('body');
var bodyHeight = $body.outerHeight();
var adminbarHeight = $('#wpadminbar').outerHeight();
var navbarFixedTopHeight = $('.hm1').outerHeight();
var locHref = location.href;
var locHashIndex = locHref.indexOf('#');
var locHash = locHref.substr(locHashIndex);
var dragging = false;
$body.on('touchmove', function() {
dragging = true;
} );
$body.on('touchstart', function() {
dragging = false;
} );
//
// Calculate the offset height for various elements and remove it from
// the element's top offset so that fixed elements don't cover it up.
//
function animateOffset( element, ms, easing ) {
$('html, body').animate({
scrollTop: $(element).offset().top - adminbarHeight - navbarFixedTopHeight + 1
}, ms, easing);
}
//
// Page load offset (if necessary).
//
$(window).load(function() {
if ( locHashIndex !== -1 && $(locHash).length ) {
animateOffset(locHash, 1, 'linear');
}
});
//
// Scroll trigger.
//
$('a[href*="#"]').on('touchend click', function(e) {
console.log($('.hm1.x-bar-fixed').outerHeight());
href = $(this).attr('href');
notComments = href.indexOf('#comments') === -1;
if ( href !== '#' && notComments ) {
var theId = href.split('#').pop();
var $el = $('#' + theId);
if ( $el.length > 0 ) {
e.preventDefault();
if (dragging) {
return;
}
animateOffset($el, 850, 'easeInOutExpo');
}
}
});
});
Don’t forget to clear your browser’s cache after adding the code. Let us know how this goes!
Hello,
Still not working in Chrome and Firefox.
Hi there,
Would you please give us the exact URL of the page you have problems with? I checked your account and you have many licenses and I could not find which website you are talking about. But I see few website in your account that works ok in Chrome and does navigate to the proper place.
Please check the case with other machines and do not limit the test to your machine.
Thank you.
Hi There,
Could you please remove this custom JS under Customizer > Custom > JS:
$('a[href*="#"]').on('touchend click', function(e) {
console.log($('.hm1.x-bar-fixed').outerHeight());
href = $(this).attr('href');
notComments = href.indexOf('#comments') === -1;
if ( href !== '#' && notComments ) {
var theId = href.split('#').pop();
var $el = $('#' + theId);
if ( $el.length > 0 ) {
e.preventDefault();
if (dragging) {
return;
}
animateOffset($el, 850, 'easeInOutExpo');
}
}
});
});
Let us know how it goes!
It still only works in Safari and not in Chrome or Firefox.
I think we could be dealing with a deeper conflict here that I don’t know how to debug.
Hi There,
Would you mind providing us with login credentials(by clicking on the Secure Note button at the bottom) so we can take a closer look? To do this, you can make a post with the following info:
Thanks.
Done. I added the secure note onto my previous comment.
Hello There,
Thanks for writing in! I have logged in and I found out that you added codes in your header.php and footer.php. I understand that you need this codes for your site. You were adding the codes incorrectly because in the theme, we do have a different kind of template. Please remove your the header.php and footer.php from your child theme first. To add your custom scripts to the header and footer, please follow this:
<?php
// =============================================================================
// VIEWS/HEADER/BASE.PHP
// -----------------------------------------------------------------------------
// Declares the DOCTYPE for the site, includes the <head>, opens the <body>
// element as well as the .x-root <div> and .x-site <div>.
// =============================================================================
$x_root_atts = x_atts( apply_filters( 'x_root_atts', array( 'id' => 'x-root', 'class' => 'x-root' ) ) );
$x_site_atts = x_atts( apply_filters( 'x_site_atts', array( 'id' => 'x-site', 'class' => 'x-site site' ) ) );
?>
<!DOCTYPE html>
<html class="no-js" <?php language_attributes(); ?>>
<head>
<?php /*?><?php if( is_page('register')) { ?>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#ihc_submit_bttn").bind("click", function(e){
e.preventDefault();
if (jQuery("#stripeToken").val() && jQuery("#stripeEmail").val()){
jQuery(".ihc-form-create-edit").submit();
return true;
}
var p = jQuery("#iumpfinalglobalp").val();
p = p * 100;
if (p==0){
jQuery(".ihc-form-create-edit").submit();
return;
}
if (p<50){
p = 50;
}
iump_stripe.open({
name: jQuery("#iumpfinalglobal_ll").val(),
description: jQuery("#iumpfinalglobal_des").val(),
email: jQuery("[name=user_email]").val(),
amount: p,
currency: jQuery("#iumpfinalglobalc").val()
});
});
});
</script>
<?php } ?><?php */?>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<?php wp_head(); ?>
<script type="text/javascript">
jQuery(document).ready(function($){
$(".ihc-ap-menu .ihc-ap-menu-item").last().addClass( "logout_tab" );
$("#upload_review_logo_field .acf-label").append("<div class='new_msgafter'>This logo will be seen on your public review page</div>");
});
</script>
<?php if ( is_user_logged_in() )
{
echo '<style>.dashboard_login{ display :block !important}
.logout_class{display :block !important}
</style>';
}
else
{
echo '<style>.dashboard_login{ display :none !important}
.logout_class{display :none !important}
</style>';
}
?>
</head>
<body <?php body_class(); ?>>
<div <?php echo $x_root_atts; ?>>
<?php do_action( 'x_before_site_begin' ); ?>
<div <?php echo $x_site_atts; ?>>
<?php do_action( 'x_after_site_begin' ); ?>
Save this file named as base.php and upload this one in your child theme’s folder wp-content/themes/pro-child/framework/views/header/
Create another file and insert this code:
<?php
// =============================================================================
// VIEWS/FOOTER/BASE.PHP
// -----------------------------------------------------------------------------
// Includes the wp_footer() hook and closes out the .x-site <div>, .x-root
// <div>, <body> and <html> tags.
// =============================================================================
?>
<?php do_action( 'x_before_site_end' ); ?>
</div> <!-- END .x-site -->
<?php do_action( 'x_after_site_end' ); ?>
</div> <!-- END .x-root -->
<?php wp_footer(); ?>
<script>
// function getUserData() {
// FB.api(
// '/171015703492702/',
// 'GET',
// {"fields":"access_token"},
// function(response) {
// // Insert your code here
// //var access = FB.getAuthResponse()['accessToken'];
//
// // console.log(response);
//
// }
// );
//
//
// }
//
// window.fbAsyncInit = function() {
// //SDK loaded, initialize it
// FB.init({
// appId : '1993173804304867',
// xfbml : true,
// version : 'v2.11'
// });
//
// //check user session and refresh it
// FB.getLoginStatus(function(response) {
// if (response.status === 'connected') {
// //user is authorized
//
// // ;
// //document.getElementById('loginBtn').style.display = 'none';
// var test = getUserData();
//
// } else {
// //user is not authorized
// }
// });
// };
//
// //load the JavaScript SDK
// (function(d, s, id){
// var js, fjs = d.getElementsByTagName(s)[0];
// if (d.getElementById(id)) {return;}
// js = d.createElement(s); js.id = id;
// js.src = "//connect.facebook.com/en_US/sdk.js";
// fjs.parentNode.insertBefore(js, fjs);
// }(document, 'script', 'facebook-jssdk'));
//
// //add event listener to login button
// var myEl = document.getElementById('access_token_btn');
//if(myEl){
//
// myEl.addEventListener('click', function() {
//
// /*document.getElementById('access_token_btn').addEventListener('click', function() {*/
// //do the login
// FB.login(function(response) {
// //console.log(response);
//
// if (response.authResponse) {
//
// getUserData();
// }
// }, {scope: 'email, public_profile, user_friends ,manage_pages, publish_stream, read_stream, publish_actions, publish_pages', return_scopes: true});
// }, false);
// }
</script>
</body>
</html>
base.php and upload this one to your child theme’s folder wp-content/themes/pro-child/framework/views/footer/
Once you’ve done everything, we can check again if the one page navigation is working or not. The steps above is crucial because your custom codes affected the whole site and messed up the page structure which invalidates it. We need to fix it first to avoid issues and future issues.
Please let us know how it goes.
This worked, thank you!
Now, I would appreciate some simple code that will calculate the height of my header and offset the anchor scroll position by that amount. Is that possible?
Thanks!
Nevermind, I found the code that I needed. Thanks for your help everyone!
Hey There,
You’re welcome! We’re glad we were able to help you out.
If you need anything else we can help you with, don’t hesitate to open another thread.
Best Regards.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.