ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Dante
• June 4, 2014 at 12:21 pm #80106
  anton123

  Member

  Post count: 67

  Hi there,

  Normally themes that offer a one page navigation system (via the main top menu) works like this and these are the problems I’m having with Dante’s:

  1) You can’t use the main navigation on other pages (like shop items / posts or portfolio items) since the main menu’s page anchor link (spacer id) doesn’t link back to the main “One Page” – so this is not workable as you need to use other pages outside of the One Page and cannot link back to it

  2) If you use normal full anchor links in the menu line example http://www.hompage.com/#services, then you loose the smooth scrolling effect plus even this does not work correctly as it doesn’t go to the correct position on the page (the start of the section is hidden under the sticky header)

  And yes, I’ve tried adding the extra CSS class “smooth-scroll-link” in the menu link item and this does not do anything.

  3) Active menu item highlighting: in no 1. above this does not highlight the active menu item but keeps “home” highlighted at all times. In no. 2 above highlights all the menu items as active (since they all have the same root domain link)

  So how do I get no.2 to work with a smooth scrolling effect and that it links to the correct position on the page for the section plus the menu only highlights that section?

  Help appreciated thanks

  BTW I have searched the forums extensively for answers and yes. I have read: http://support.swiftideas.net/knowledgebase/how-to-create-a-one-page-site-using-the-one-page-navigation/

  June 4, 2014 at 12:24 pm #80108
  anton123

  Member

  Post count: 67

  This reply has been marked as private.
  June 5, 2014 at 2:16 pm #80422
  Swift Ideas – Ed

  Keymaster

  Post count: 15264

  Hi @anton123,

  Currently that is how it works – but we are looking to improve it. The current setup isn’t really designed for a one page nav with sub-pages, due to only being able to have a single menu across the site. This is why we introduced the side one page nav.

  The issue with the # link not scrolling to the section when used in a full URL, is that this is standard browser functionality – not something that can be overridden.

  We’ll see what we can do for an update in the near future, hopefully add in a menu override option, and the highlighting to counter these issues.

  – Ed

  June 5, 2014 at 2:23 pm #80429
  anton123

  Member

  Post count: 67

  Thanks Ed,

  For the # link full URL – if I disable the sticky menu, you can see the start of the section [that might be an option although the user then has to scroll up to see the menu again)
  What about the menu active state for the relevant section, plus getting smooth scroll to work – are these possible?

  Thanks again

  June 5, 2014 at 3:01 pm #80441
  Swift Ideas – Ed

  Keymaster

  Post count: 15264

  @anton123 – menu active state is something we’re working on adding. The issue with the full URL not smooth scrolling is the issue that the browser causes this – not something we can override.

  We’ll look into a few possible methods.

  – Ed

  June 30, 2014 at 12:01 pm #86978
  anton123

  Member

  Post count: 67

  Thanks guys for updating this.

  I’m testing this and want to use it, but the anchor links from other pages back to the ‘one page’ do not land on the right spot on the page (it is hidden by the sticky menu) plus the menu does not highlight the active state (main nav to show the current area)

  How do I get the anchor links to display the relevant page section just below the sticky header and not hidden behind it with the relevant menu item highlighted?

  I will send the links and examples

  Thanks very much

  June 30, 2014 at 12:05 pm #86980
  anton123

  Member

  Post count: 67

  This reply has been marked as private.
  June 30, 2014 at 12:31 pm #86991
  anton123

  Member

  Post count: 67

  And also: For the one page navigation menu: how do you get ‘Home’ to go back to the very top of the page?
  If you use the custom link: http://www.domain.com/#top then the Home menu item stays highlighted at all times.

  If you use just # or #top for the link URL then nothing happens when you click on it?

  You can’t use a spacer id, because it doesn’t go to the very top of the page

  Plus- when the page first loads, you want ‘home’ to be highlighted

  Please advise thanks

  June 30, 2014 at 5:02 pm #87067
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  I made some changes here http://taffydev.com.au/clients/oamm/retail/#shopping . Please check menus and sub menus and hope you will like this .If you like then i can make changes to your website too .

  Thanks

  June 30, 2014 at 6:11 pm #87080
  anton123

  Member

  Post count: 67

  Thanks, well that seems to work.
  What changes to the code did you make? Please list the changes and lets see if we can sort this out

  Thanks very much

  July 1, 2014 at 4:03 am #87165
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Please first disable smooth scroll plugin after paste given below code at Admin -> Theme Options -> Custom JS.

  <script>
  jQuery( document ).ready(function() {
  scrollid = window.location.hash;
  if(scrollid){
  spacerHeight = jQuery(scrollid).height(),
  headerHeight = 0;
  if (jQuery('.sticky-header').length > 0) {
  headerHeight = jQuery('.sticky-header').height();
  }
  if (jQuery('#wpadminbar').length > 0) {headerHeight = headerHeight + 28;
  }
                          
  jQuery('html, body').stop().animate({
  scrollTop: jQuery(scrollid).offset().top + spacerHeight - headerHeight - 30
                          }, 1000, 'easeInOutExpo');
   }
  jQuery('ul#menu-one-page-1 li a').bind('click', function(e) {
  var anchor = jQuery(this),
  url = anchor.attr('href');
   scrollid =    url.substring(url.indexOf('#'));
  spacerHeight = jQuery(scrollid).height(),
  headerHeight = 0;
  if (jQuery('.sticky-header').length > 0) {
  headerHeight = jQuery('.sticky-header').height();
  }
  if (jQuery('#wpadminbar').length > 0) {headerHeight = headerHeight + 28;
  }
                          
  jQuery('html, body').stop().animate({
  scrollTop: jQuery(scrollid).offset().top + spacerHeight - headerHeight - 30
                          }, 1000, 'easeInOutExpo');
                          
      e.preventDefault();
  });
  });
  </script>

  Thanks 🙂
  With Best Regards
  Swift Ideas

  July 1, 2014 at 6:33 am #87177
  anton123

  Member

  Post count: 67

  Thanks Mohammad,
  The difference I see is that now: the menu does highlight the active state from outside anchor links (main nav to show the current area) and the landing position is no longer hidden behind the sticky menu. But the position is still not exactly right, it is now about 200px below where it should display?

  So here is a list of outstanding issues to get the One Page navigation to work properly:

  – the anchor links from other pages back to the ‘one page’ do not land on the right spot on the page (it is now about 200px below)
  – For the one page navigation menu: how do you get ‘Home’ to jump to the very top of the page (without reloading the page again)?
  – when the page first loads, you want ‘home’ to be highlighted in the menu

  Thanks very much for your help with this

  July 1, 2014 at 9:54 am #87241
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Please stop editing at your side so i can make these fix.
  Thanks

  July 1, 2014 at 9:57 am #87243
  anton123

  Member

  Post count: 67

  Thanks – I’m only working in the Rev slider.

  Does that affect things?

  July 1, 2014 at 9:59 am #87244
  anton123

  Member

  Post count: 67

  This reply has been marked as private.
• Back to forum

  Posted in: Dante