How to add a class to an HTML element with PHP?

Navigation
1

I created a side menu using text widget in wordpress 

<ul style="list-style:none">
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/andre-gambier-campos/">André Gambier Campos</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/eduardo-luiz-cury/">Eduardo Luiz Cury</li>   </a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/fabio-tatei/">Fábio Tatei</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/franco-de-matos/">Franco de Matos</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/genaro-aguilar-gutierrez/">Genaro Aguilar Gutierrez</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/marcos-antonio-favaro-martins/">Marcos Antônio Fávaro Martins</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/maria-cristina-cacciamali/">Maria Cristina Cacciamali</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/maria-de-fatima-jose-silva/">Maria de Fátima José-Silva</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/natalia-nunes-ferreira-batista/">Natalia Nunes Ferreira Batista</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/rosana-aparecida-ribeiro/">Rosana Aparecida Ribeiro</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/tania-de-toledo-lima/">Tânia de Toledo Lima</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/thais-virga-passos/">Thaís Virga Passos</li></a>
<li style="margin-bottom: -15px !important;"><a href="http://www.nespi.com.br/pesquisadores/umberto-celli-junior/">Umberto Celli Junior</li></a>

WhatIwantedwastoclickonthenametoaddan"active" class to the link, to show the user where it is, just as it works in the horizontal menu:

Itriedtodoso

<li<?phpif($verifica['AndréGambierCampos']==true)echo"class='active'" ?> 
<a href="http://www.nespi.com.br/pesquisadores/andre-gambier-campos/">Início</a>
 </li>

But it does not work.

    
asked by anonymous 28.01.2015 / 01:48

1 answer

2

My example, FUNCTION, makes an active menu item based on the current URL with jQuery:

Jquery: 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><scripttype="text/javascript">
    jQuery(document).ready(function($){
        // Get current url
        // Select an a element that has the matching href and apply a class of 'active'. Also prepend a - to the content of the link
        var url = window.location.href;
        $('.menu a[href="'+url+'"]').addClass('current_page_item');
    });
</script>

Style: 

<style type="text/css">
a {
    color:#000;
    text-decoration:none;
}
a:hover {
    text-decoration:underline;
}
a:visited {
    color:#000;
}
.nav {
    padding:10px;
    border:solid 1px #c0c0c0;
    border-radius:5px;
    float:left;
}
.nav li {
    list-style-type:none;
    float:left;
    margin:0 10px;
}
.nav li a {
    text-align:center;
    width:AUTO;
    float:left;
}


</style>

HTML 

<header>
<div class="menu">
    <ul class="nav">
        <li><a href="#">INÍCIO</a>
        </li>
        <li>|</li>
        <li><a href="#">MISSÃO</a>
        </li>
        <li>|</li>
        <li><a href="#">QUEM SOMOS</a>
        </li>
        <li>|</li>
        <li><a href="#">PESQUISADORES</a>
        </li>
    </ul>
</div>    
</header>
    
28.01.2015 / 02:22
Paging effects with javascript Create id for a new ListView?