Можно ли php включить панель навигации Bootstrap на каждой странице, но с использованием дополнительного кода, чтобы код отображал, какая страница была активной - PullRequest
0 голосов
/ 23 апреля 2020

Я вполне уверен, что это так, но на данном этапе это выходит за рамки моих возможностей. Как видно из заголовка, я хотел бы включить navbar в качестве php для каждой страницы, чтобы избежать повторения кода, но нужно изменить его на каждой странице, чтобы обозначить, какой из них активен.

У меня есть следующая панель навигации код:

image

Ответы [ 2 ]

0 голосов
/ 23 апреля 2020

Я полагаю, более простое решение, чем использование Рона, - CSS. Каждая страница может иметь свой уникальный идентификатор / класс (например, .mixing-page) и выбирать меню на основе этого.

.mixing-page .navbar li:nth-child(4) a {
 color :red;
}
<div class="mixing-page">
<nav class="navbar navbar-expand-sm navbar-light" >
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item">
        <a class="nav-link" href="/index.html">Home</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/editing.html">Editing</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/reamping.html">Reamping</a>
      </li>
      <li class="nav-item active">
        <a class="nav-link" href="/mixing.html">Mixing <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/mastering.html">Mastering</a>
      </li>
    </ul>
  </div>
</nav>
</div>
0 голосов
/ 23 апреля 2020

Код Navbar должен быть в заголовке, где вы должны написать код HTML один раз и включить заголовок во все ваши страницы.

Затем вы можете проверить с помощью PHP URL страницы Вы находитесь на уровне, соответствующем href от каждого из пунктов меню, и если true, например, добавьте class='active'.

Вы можете сделать то же самое с JS, не используя PHP.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...