How Can I Use One Nav Bar Code On Multiple Pages, But Have The Current Page Highlighted?

So, I run my church's website and I try to stay pretty basic in the coding, but we have seasonal pages that we add and remove from the website all the time so I get tired of changi

Solution 1:

add an id attribute to the body tag of each of your pages, like this:

<bodyid="home"><!-- this would be for your home page for example -->

...

<bodyid="about"><!-- this would be for your about page... -->

add the same to the li tags of your nav, like this:

<li id="home">Home</li>
<li id="about">About</li>

then in the CSS file just do this:

body#homeli#home, body#aboutli#about { // style of the active menu item }