Bootstrap Data-Toggle

[AndyCr15]

Hi, I wonder if anyone can tell me how to implement the data-toggle on my navbar. Previously, you would click the item, it would load the new page, including the navbar again, with the correct one set to active.

I am now creating header.php which will go into each page and it looks like this -

<a class="navbar-brand" href="index.php">AAUK</a>
    <ul class="nav navbar-nav" data-toggle="tab">
        <li class="nav-item"> <a class="nav-link" href="youtube.php">YouTube</a> </li>
        <li class="nav-item"> <a class="nav-link" href="android.php">Android Apps</a> </li>
        <li class="nav-item"> <a class="nav-link" href="about.php">About Me</a> </li>
        <li class="nav-item"> <a class="nav-link" href="support.php">Support Me</a> </li>
        <li class="nav-item"> <a class="nav-link" href="contact.php">Contact Me</a> </li>
        <li class="nav-item"> <a class="nav-link" href="shop.php">Shop</a> </li>
    </ul>

As it stands, I click the Nav item and it does highlight, but then nothing happens. I assume I shouldn't be loading the linked page, but just changing the contents of a <div> or something along those lines? Can anyone give me some pointers?

Thanks.