Current link not showing in sub-directory on self hosted site

On the self hosted website the current link is not showing any color (current class) on pages in a sub-directory (pages in folder). However, it does work within the Webflow environment.

Self hosted site - see main menu
http://olex.org/at/arbeiten/dunton-hot-springs-colorado.html

Webflow site - see main menu
http://olex-staging.webflow.io/arbeiten/dunton-hot-springs-colorado

Does anybody know what the problem is?

You forgot to mention that you are using custom code, and where you got the code from, and share the code here.

I suspect it’s either due to the additional /at/ folder, or the html extension at the end. If it’s the latter, you can configure your server to remove the extension.

I am not sure to what custom code you are referring to. I have a JS script to show/hide the navigation on scroll up/down but nothing which would affect the internal page linking.

My issue is most likely because of the /at/ folder and/or the html extensions. For some reason I am not able to remove the html extensions through the .htaccess file following the instructions in this thread: Internal links change to *.html after code export

Still, I don’t understand why putting my site in a sub-directory would cause this issue by not highlighting the “current” state.

This is what detects and makes parent page links current when in a subpage.

1 Like

Ok, I think I remember now adding that piece of code…

So, what this basically means is that I need to remove the code if I self host the website and that code is only needed to correctly display the “current” state in Webflow?

Btw., if I remember correctly I actually used the code from one of your suggestions regarding the current links etc. found here: Current pseudo classes on sub pages

Maybe I am missing something here. In addition to adding the code, do I also need to follow your suggested steps:

Move the parent pages back to the root (no folders).

Example:
/services - Parent page with link in the menu
/services/services-page - Child page in the subfolder, subfolder has with same slug as parent page /services

Re-publish your site.

If possible maybe you could take a look and let me know what kind of adjustments I need to make in order to highlight sub-pages when the site is self hosted. As mentioned before, everything works fine in the Webflow environment.

https://preview.webflow.com/preview/olex-staging?preview=0a95ebf84856587a1eef1a953ea19cea

The problem is that on the page “http://olex.org/at/arbeiten/dunton-hot-springs-colorado.html”, the hyperlink is “arbeiten.html” which is not found in the current URL.

I already mentioned the solution above.

These are the keywords you need to Google: “htaccess remove html”

I tried already removing the html extension without any success. It seems that many people have problems with this.

Thanks.

var Webflow = Webflow || [];
Webflow.push(function() {
  var curUrl = location.pathname;
  $('a').each(function() {
    $(this).toggleClass('w--current', curUrl.indexOf($(this).attr('href')) != -1);
  });
});

It works great on Webflow hosted sites.

But it does not function when the site is exported~

Any idea how to modify it?