change login link to say logout | PHP | bootstrap

Question

I've coded a very simple design in bootstrap, the code sits internally where I work so I am unable to publish externally, however it's a simple jobs board design. Coded in bootstrap 4, html and css.

I've separated the header part of the design so that I call it from this file:

<?php include('header/header.php'); ?>

the file header.php includes the very simple nav:

 <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
              <a class="nav-link" href="http://vacancies.prospect.local/registration/register.php">Register <span class="sr-only">(current)</span></a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="http://vacancies.prospect.local/registration/register.php">Login</a>
            </li>
          </ul>
          <span class="navbar-text">
            <a href="https://www.prospect.org.uk/"><i class="fas fa-sign-out-alt"></i> Return to main Prospect website</a>
          </span>
 </div>

After a user has logged in (on a simple form on the body), I want the login link header.php file to change to logout. I've read numerous threads with so many variations but I am confused how to apply any of them as my php knowledge is very low. I've read that javascript or Ajax will do the job? I'm ok in bootstrap but I have no programming knowledge and am teaching myself, starting on what I hope are these basics.

I've tried to wrap the login code with php tags and ISSET functions, but I am unable to get what I want working..... any help or advice would be very much appreciated, thanks!

Answer 1

If you can use Session and store session data, you can change the login button to logout based on session data.

<?php 
    session_start();
    //After Login
    $_SESSION["user_id"] = 10;
?>

<div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
        <li class="nav-item active">
            <a class="nav-link" href="http://vacancies.prospect.local/registration/register.php">Register <span class="sr-only">(current)</span></a>
        </li>
        <li class="nav-item">
        <?php
            if(isset($_SESSION['id'])){?>
                <a class="nav-link" href="http://vacancies.prospect.local/registration/logout.php">Logout</a>
        <?php }else{?>
            <a class="nav-link" href="http://vacancies.prospect.local/registration/register.php">Login</a>
        <?php } ?>
        </li>
    </ul>
    <span class="navbar-text">
    <a href="https://www.prospect.org.uk/"><i class="fas fa-sign-out-alt"></i> Return to main Prospect website</a>
    </span>
</div>

You can also check the link: http://php.net/manual/en/reserved.variables.session.php