php - Highlight a list element when I'm browsing the very page
Get the solution ↓↓↓I saw a few tutorial about this problem but none of them satisfied me. I want to highlight the single element of my list which matches the page that I'm browsing. I created the code with php, is a wordpress based website, and the code actually works because when I echo the uri which I'm on it will display the right uri, but the if statement I created to add a class when I'm on the website won't output anything.. and I don't understand why.. anyway.. here's the code:
header.php
<ul class="nav nav-pills sliding" id="Jcollapse">
<li class="<?php if ($current == "/why-chickapea/"){ echo "current";}?>"><a href="/why-chickapea/"><span>Why Chickapea?</span></a></li>
<li class="<?php if ($current == "/our-pasta/"){ echo "current";}?>"><a href="/our-story/"><span>Our story</span></a></li>
<li class="<?php if ($current == "/shop-chickapea/"){ echo "current";}?>"><a href="/shop-chickapea/"><span>Shop</span></a></li>
<li class="<?php if ($current == "/recipes/"){ echo "current";}?>"><a href="/recipes/"><span>Recipes</span></a></li>
<li class="<?php if ($current == "/blog/"){ echo "current";}?>"><a href="/blog/"><span>Blog</span></a></li>
</ul>
In each page I added a php snippet:
<?php $current = $_SERVER["REQUEST_URI"]; ?>
If I echo the var $current I will obtain the right url in this format: /pagename/
At the end I style the class current with a yellow color
.current {
color:yellow;
}
.current a {
color:yellow;
}
Does anyone know where my mistake is?
this is the page website: choosechickapea.com
As you can see the class that my code will generate is empty, but if I echo each value the uri I will obtain is the right one
Answer
Solution:
The simplest explanation would be, that you print the header before $current is set.
The second simplest explanation is different scopes, meaning either you set $current in a non-global scope or you read it in a non-global scope, and those two (whatever they are) are different. Since someone said wordpress, I guess there is some encapsulation into functions (thus changing the scope). Using theglobal
keyword may be a solution, but a dirty one. But since you're already avoiding wordpress functions ...
Answer
Solution:
The actual code is:
Before declaring in the header the if statement, SET the value of the variable. If you'll declare in the body, even before loading the header with a, for example require once or in wordpress:
<?php get_header(); ?>
It won't work, the variable has to be set in the header like this:
<?php $current = $_SERVER["REQUEST_URI"]; ?>
<header class="navbar-fixed-top">
<ul class="nav nav-pills sliding">
<li class="<?php if ($current == "/your-url/"){ echo "current";}?>"><a href="/your-url/"><span>your url</span></a></li>
<li class="<?php if ($current == "/other-url/"){ echo "current";}?>"><a href="/other-url/"><span>/other url/</span></a></li>
</ul>
</header>
Share solution ↓
Additional Information:
Link To Answer People are also looking for solutions of the problem: http failure during parsing for
Didn't find the answer?
Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.
Similar questions
Find the answer in similar questions on our website.
Write quick answer
Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.