After downloading an HTML template from a website, I encountered an issue where the Bootstrap active menu was not working properly after using the PHP include() function to add the same header and footer to every page. I also tried using JavaScript and jQuery, but the problem persisted.
I am now seeking advice on how to fix the active menu feature. Any help would be greatly appreciated.
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.php">
<img class="img-responsive" src="assets/images/logo.jpg" alt="">
<div class="logo">
<span style="">માનસિક દિવ્યાંગ બાળકોની સંસ્થા</span>
</div>
</a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li class="active">
<a href="index.php"><i class="fa fa-home" aria-hidden="true" style="font-size: 25px; margin-top: -5px;"></i></a>
</li>
<li>
<a href="activity.php">અમારા પ્રવૃત્તિઓ</a>
</li>
<li>
<a href="gallery.php">ગેલેરી</a>
</li>
<li>
<a href="management.php">સંચાલન</a>
</li>
<li>
<a href="about.php">અમારા વિશે</a>
</li>
<li>
<a href="contact.php">સંપર્ક</a>
</li>
<li>
<div class="donate-button text-center">
<a class="btn btn-donate" href="contact.php">દાન કરો</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
</header>