У меня 3 страницы. На основании того, на какой странице я нахожусь, я хотел бы изменить класс активных, чтобы это отразить.
3 страницы – это индекс, блог и контакт. У каждого из них есть также и субстраницы, например, Work имеет разные PHP-файлы для различных проектов. Блог имеет различные сообщения в блоге. Контакт – это только контактная форма PHP.
Я хотел бы, основываясь на том, что человек включен, перемещает класс = «активный». Сейчас он жестко закодирован на каждой странице.
Мой код:
<ul class="list-inline" id="menu"> <li class="active"> <a href="index.php">work</a> </li><!-- --><li> <a href="blog.php">blog</a> </li><!-- --><li> <a href="contact.php">contact</a> </li><!-- --><li> <a href="#"><img class="social" src="img/icon/icon-facebook.png" alt="facebook"></a> <a href="#"><img class="social" src="img/icon/icon-twitter.png" alt="twitter"></a> </li> </ul> Существует много подходов, один из которых:
<?php $page = ''; // @TODO: assign with the right value $work_class = $page == 'work' ? 'active' : ''; $blog_class = $page == 'blog' ? 'active' : ''; $contact_class = $page == 'contact' ? 'active' : ''; ?> <ul class="list-inline" id="menu"> <li class="<?=$work_class?>"> <a href="index.php">work</a> </li><!-- --><li class="<?=$blog_class?>"> <a href="blog.php">blog</a> </li><!-- --><li class="<?=$contact_class?>"> <a href="contact.php">contact</a> </li><!-- --><li> <a href="#"><img class="social" src="img/icon/icon-facebook.png" alt="facebook"></a> <a href="#"><img class="social" src="img/icon/icon-twitter.png" alt="twitter"></a> </li> </ul>
Чтобы получить более точный ответ, было полезно, если бы вы предоставили более точную информацию о том, как выглядит остальная часть вашего кода.
я бы петли его ..
<?php $base = substr($_SERVER['PHP_SELF'],strrpos($_SERVER['PHP_SELF'], '/')-1); // Something like this to determine the current file such as 'blog.php' $links = array(); $links['work'] = 'index.php'; $links['blog'] = 'blog.php'; // .. foreach($links AS $name => $url) { ?> <a href="<?php echo $url; ?>" <?php if($base == $url) ?> class="active"<?php } ?> ><?php echo $name; ?></a> <?php } ?>
вы можете добавить активные классы для обертывания элементов li тоже ofc.
<ul class="list-inline" id="menu"> <li<?php if ($_SERVER['SCRIPT_FILENAME'] == "index.php") { echo " class=\"active\""; } ?>> <a href="index.php">work</a> </li> <li<?php if ($_SERVER['SCRIPT_FILENAME'] == "blog.php") { echo " class=\"active\""; } ?>> <a href="blog.php">blog</a> </li> <li> <a href="contact.php">contact</a> </li> <li> <a href="#"><img class="social" src="img/icon/icon-facebook.png" alt="facebook"></a> <a href="#"><img class="social" src="img/icon/icon-twitter.png" alt="twitter"></a> </li> </ul>
и так далее
Добавьте этот PHP:
<?php #add class .active to current page $directoryURL = $_SERVER['REQUEST_URI']; $path = parse_url($directoryURL, PHP_URL_PATH); $components = explode('/', $path); $currentPage = preg_replace("/\\.[^.\\s]{3,4}$/", "", end($components)); if ($currentPage == "") { $currentPage = "index"; } function href($url) { global $currentPage; $path = explode('/', $url); $page = preg_replace("/\\.[^.\\s]{3,4}$/", "", end($path)); echo 'href="' . $url . '"'; if ($page == $currentPage) { echo 'active'; } } ?>
Настройте меню таким образом:
<li><a <?php href('about.php');?>>About</a></li>
* Это должно сработать. Удачи