Set navbar selection to class active while also ha…

I’m trying to figure a way to have “Login” be set to logout, when a user is signed in, but also having their current navbar selection be highlighted in blue?

I moved the html in the php below out of the html body. This html was repeated in every file for each page and <a class="active" href="index.php">Home</a> was different according to the page selection. I tried to minimize my code repetition by moving it to an external file to be called in via <?php include ("scripts/navbar.php"); ?>.

For example Here you can see Contact is blue because it’s the page I’m currently on. But if a user is signed in, I want Contact to still be blue if they’re currently on the Contact.php page, but to have Login changed to Log Out for the session. I have my logout script functioning correctly, but I’m not sure how to dynamically change both login to logout, while setting the selection to blue.

    <?php if ( ! isset($_SESSION['username'] ) ): ?>
        <div class="topnav">
      <img src="assets/images/header5.jpg">
          <a href="Signin.php">Login</a>
      <a href="contact.php">Contact</a>
      <a href="about.php">About</a>
      <a href="sample.php">Sample</a>
      <a href="fees.php">Fees</a>
      <a href="vintage.php">Vintage</a>
      <a href="services.php">Services</a>
    <a class="active" href="index.php">Home</a>
    </div>
        <?php else: ?>
    <div class="topnav">
      <img src="assets/images/header5.jpg">
          <a href="/script/LogOut.php">Logout</a>
      <a href="contact.php">Contact</a>
      <a href="about.php">About</a>
      <a href="sample.php">Sample</a>
      <a href="fees.php">Fees</a>
      <a href="vintage.php">Vintage</a>
      <a href="services.php">Services</a>
   <a class="active" href="index.php">Home</a>
    </div>
    <?php endif; ?>

I ideally didn’t want to have 6-7 different files for the navbar,

Answer

<div class="topnav">
<img src="assets/images/header5.jpg">
<?php if (!isset($_SESSION['username'])) : ?>
<a href="Signin.php">Login</a>
<?php else : ?>
<a href="/script/LogOut.php">Logout</a>
<?php endif; ?>
<a href="contact.php">Contact</a>
<a href="about.php">About</a>
<a href="sample.php">Sample</a>
<a href="fees.php">Fees</a>
<a href="vintage.php">Vintage</a>
<a href="services.php">Services</a>
<a class="active" href="index.php">Home</a>
</div>

Set navbar selection to class active while also having the Login link switched to Logout if signed in?

Advertisement

Answer