One sidenav for all HTML pages

1

Hello everyone!

I have been learning front-end web development for a few months. I have recently built my own information based website that only uses HTML and CSS.

my website: learnrussianwithmasha dot com

I’m still struggling with JavaScript still, hence my website is not interactive at this point, although I do plan to add some interactive features to it in the future (like tests, quizzes etc)

My question basically concerns the sidenav bar I have on my site.

I want the sidenav to be the same on all pages, Is there a way to incorporate a PHP menu to all HTML pages or am I completely on the wrong track here? I have read a few forum threads on this topic but opinions on this matter seem to differ.

At this point, whenever I create a new page, I have to manually add it to the sidenav on all the pages. The site currently has over 40 pages, so you can imagine how time-consuming that is.

Please don’t be harsh as I am relatively new to web development :slight_smile:

Any help from experienced web developers is appreciated.

Thanks!

2

You could write the sidenav in a separate file, then include or require it in your other pages. Something like:

sidenav.php

<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Foo</a></li>
    <li><a href="#">Bar</a></li>
    <li><a href="#">Baz</a></li>
  </ul>
</nav>

home.php

<body>
  <?php require 'sidenav.php' ?>

  <!-- content for home follows here -->
</body>
3

Thank you for your suggestion! I will definitely try it out.

4