Docs

[Ryandm1983]

Howdy X Theme, hope you all well that side.

Your help with the below would be much appreciated. I have a X Theme site..”http://tabuhouse.co.za/”

The problem page in question is..”http://www.tabuhouse.co.za/rooms/”

This page has 1 Section & currently several Rows. Each of the rows have been given a ID attribute to enable the auto-navigation feature. For example row3 has an id tag “pool-room”, using the url “http://www.tabuhouse.co.za/rooms/#pool-room”, should take us to that exact row, but it doesnt. The links always always default to the bottom of the page for some odd reason.

The front/home page has url links to each row on the room page and none of them work with exception of the first row / id attribute being the “blue-room”…. the rest always just link to the bottom of the page.

Please advise – thanks guys….login details below have been PM’d

[Ryandm1983]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing in. I have tested your page and it seems you did it correct and they are working fine as expected. For example the URL http://www.tabuhouse.co.za/rooms/#pool-room take to the right section – http://prntscr.com/dgjk67

Let’s check again and confirm the issue.

Cheers!

[Ryandm1983]

Hi there;

Thanks for your reply Rupok,

I presume it may be browser dependant, please advise what browser you used to test successfully.

[Paul R]

Hi,

I was able to replicate the issue.

You could try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

[Ryandm1983]

Hi Paul

Thanks for the heads up,

I see it is the Slider Revolution that is causing the problem. In an attempt to troubleshoot Rev Slider i created a plain default slider with no images etc and only populated the “rooms” page with this slider and omitted the others. Unfortunately the problem persists.

Is there a solution however, as this is a bundled plugin that comes with X Theme.

Thanks in advance gents.

[Lely]

Hello There,

Please try adding the following code on Settings Tab > Custom JS:

$( document ).ready( function(){

if(location.href.split("#").slice(-1)[0].length >=1) {

$('html,body').animate({scrollTop: $('#'+location.href.split("#").slice(-1)[0]).offset().top - ( $('.x-navbar').height() + 50 ) },700 ,'swing');}
}

});

Hope this helps.

[Ryandm1983]

Thank you

Im not sure however where to add this… i tried adding it to Rev Slider settings tab but it clears out the whole slider and doesnt fix the issue of the # navigation issue.

I also tried adding it to the Theme settings, Custom JS to no avail.

[Rue Nel]

Hello There,

Sorry if it didn’t work out. There was a typo error in the code. Please have it updated and use this instead:

(function($){
 $( document ).ready( function(){
  if(location.href.split("#").slice(-1)[0].length >=1) {
    $('html,body').animate({scrollTop: $('#'+location.href.split("#").slice(-1)[0]).offset().top - ( $('.x-navbar').height() + 50 ) },700 ,'swing');}
  }
})(jQuery);

Please let us know how it goes.

[Ryandm1983]

Hi

I added this code to custom JS. # tags still dont work ?

[Rue Nel]

Hello There,

Thanks for updating in! There is still a JS error on the page. Please check this:

I would recommend that you have the JS code updated and use this code instead:

(function($){
 $( document ).ready( function(){
  if(location.href.split("#").slice(-1)[0].length >=1) {
    $('html,body').animate({scrollTop: $('#'+location.href.split("#").slice(-1)[0]).offset().top - ( $('.x-navbar').height() + 50 ) },700 ,'swing');
  }
})(jQuery);

Please let us know how it goes.

[Author]

Posts