I purchased Inspinia two days ago and I have been struggling with making top navbar stick at the top. The preview pages work with fixed navbar but the downloaded files do work for fixed navbar at the top when I follow the documentation that comes with it.
The documentation says that I should add classes .navbar and .navbar-fixed-top for the nav element and also add .fixed-nav and .fixed-nav-basic to the body element.
The problem is that the moment I follow the instructions given in the documentation the page elements become disordered with some elements and contents running straight from top to bottom without the expected placement and order.
To see this problem, please use a downloaded copy and follow the instructions in the documentation that comes with it. You will notice it does work.
Kindly assist on how to solve this issue. I bought this theme to work on an urgent application which should be completed in some few weeks.
I just checked everything and both navbar fixed top options works. Let's start with the simple one: Please add "fixed-nav" class to the open body tag. Then please find the "<nav>" element that has "navbar-static-top" class and change it to the "navbar-fixed-top". This should give you basic navbar fixed option. If this works then you can go with the second option.
If this will still not working please provide url to your demo so I will be able to open it and debug.
I have done as you have said and it is still not working.
I have uploaded the files to a temporary domain for you to check. You can view the page at https://inspinia.zenoph.com
I have added a small script and HTML contents to see the classes added to the "<body>" and "<nav>" tags. Please use the "+" button to add classes and "-" button to remove classes for the "<body>" and "<nav>" tags. It is added only in the "index.html" file which defaults to the "Dashboard v.1" page.
My aim is to make the sidebar and the top navbar fixed. So far, only the "fixed-sidebar" to the "<body>" element works. The rest to achieve a fixed top navbar do not work. The page contents become disordered when trying to make the top navbar fixed.
I also noticed some oddity in the initial class for the "<nav>" tag. The documentation says to remove class "navbar-static-top" from the the "<nav>" tag. You also emphasised the same thing to remove "navbar-static-top". However, the copy of the download I have does not have "navbar-static-top" but rather has "navbar-static-side" on all of the ".html" files in the download.
I am thinking maybe my copy of the download is different from what the documentation and you describe since the pages in my download have "navbar-static-side" rather than "navbar-static-top".
Please try to update the classes dynamically with the controls I have added to see the effect and see how you can assist me.
Great you prepared a demo, it is much easier to help, thank you. As far as I see you added css class to the wrong <nav> element. In the html you can find two nav element, one with the navbar-static-side and one with the navbar-static-top. You should not modify the navbar-static-side, but you added css class to it and this is the reason you have visual issues.
Let's summarize:
1. To the <body> open tag pleas add "fixed-nav" so the final code will look like: <body class="fixed-nav"> 2. In the <nav class="navbar navbar-static-top"> please replace "navbar-static-top" to "navbar-fixed-top".
*Please do not change any other <nav> elements, especially <nav class="navbar-default navbar-static-side">
Fixed Top Navbar not working
I purchased Inspinia two days ago and I have been struggling with making top navbar stick at the top. The preview pages work with fixed navbar but the downloaded files do work for fixed navbar at the top when I follow the documentation that comes with it.
The documentation says that I should add classes .navbar and .navbar-fixed-top for the nav element and also add .fixed-nav and .fixed-nav-basic to the body element.
The problem is that the moment I follow the instructions given in the documentation the page elements become disordered with some elements and contents running straight from top to bottom without the expected placement and order.
To see this problem, please use a downloaded copy and follow the instructions in the documentation that comes with it. You will notice it does work.
Kindly assist on how to solve this issue. I bought this theme to work on an urgent application which should be completed in some few weeks.
I just checked everything and both navbar fixed top options works.
Let's start with the simple one: Please add "fixed-nav" class to the open body tag. Then please find the "<nav>" element that has "navbar-static-top" class and change it to the "navbar-fixed-top". This should give you basic navbar fixed option. If this works then you can go with the second option.
If this will still not working please provide url to your demo so I will be able to open it and debug.
Best regards, Damian
I have done as you have said and it is still not working.
I have uploaded the files to a temporary domain for you to check. You can view the page at https://inspinia.zenoph.com
I have added a small script and HTML contents to see the classes added to the "<body>" and "<nav>" tags. Please use the "+" button to add classes and "-" button to remove classes for the "<body>" and "<nav>" tags. It is added only in the "index.html" file which defaults to the "Dashboard v.1" page.
My aim is to make the sidebar and the top navbar fixed. So far, only the "fixed-sidebar" to the "<body>" element works. The rest to achieve a fixed top navbar do not work. The page contents become disordered when trying to make the top navbar fixed.
I also noticed some oddity in the initial class for the "<nav>" tag. The documentation says to remove class "navbar-static-top" from the the "<nav>" tag. You also emphasised the same thing to remove "navbar-static-top". However, the copy of the download I have does not have "navbar-static-top" but rather has "navbar-static-side" on all of the ".html" files in the download.
I am thinking maybe my copy of the download is different from what the documentation and you describe since the pages in my download have "navbar-static-side" rather than "navbar-static-top".
Please try to update the classes dynamically with the controls I have added to see the effect and see how you can assist me.
Thank you.
Great you prepared a demo, it is much easier to help, thank you.
As far as I see you added css class to the wrong <nav> element. In the html you can find two nav element, one with the navbar-static-side and one with the navbar-static-top. You should not modify the navbar-static-side, but you added css class to it and this is the reason you have visual issues.
Let's summarize:
1. To the <body> open tag pleas add "fixed-nav" so the final code will look like: <body class="fixed-nav">
2. In the <nav class="navbar navbar-static-top"> please replace "navbar-static-top" to "navbar-fixed-top".
*Please do not change any other <nav> elements, especially <nav class="navbar-default navbar-static-side">
Best regards, Damian
It's working now. I was messing up with the wrong "<nav>" throughout my struggle.
Thank you for your support. That was great.