Indicar la página actual (Current Page) en un menú con PHP y CSS

Vamos añadir dinámicamente una clase CSS (.active) mediante PHP a los enlaces de un menú cuando sean la página activa o current page.

Para ello, añadimos la siguiente función PHP en cada una de las secciones de nuestro Sitio Web.

<?php
function active($currect_page){
$url_array = explode('/', $_SERVER['REQUEST_URI']);
$url = end($url_array);
if($currect_page == $url){
echo 'active';
}
}
?>

Ahora, añadimos la siguiente clase dinámica a las distintas opciones de nuestro menú:

class="<?php active('pagina.php');?>"

Sustituir pagina.php por el nombre de cada uno de los documentos PHP que conforman las secciones de nuestra Web.

Supongamos que este es nuestro menú:

<ul>
<li><a href="index.php">Inicio</a></li>
<li><a href="el-equipo.php">El equipo</a></li>
<li><a href="servicios.php">Sevicios</a></li>
<li><a href="contacto.php">Contacto</a></li>
</ul>

Tendríamos que modificarlo para que quedara de la siguiente manera:

<ul>
<li><a class="<?php active('index.php');?>" href="index.php">Inicio</a></li>
<li><a class="<?php active('el-equipo.php');?>" href="el-equipo.php">El equipo</a></li>
<li><a class="<?php active('servicios.php');?>" href="servicios.php">Sevicios</a></li>
<li><a class="<?php active('contacto.php');?>" href="contacto.php">Contacto</a></li>
</ul>

Y por último, definimos los estilos de la clase CSS .active y .active:hover en nuestra hoja de estilos CSS:

.active {
color: red !important;
}
.active:hover {
color: blue !important;
}

Añadimos !important para que ignore cualquier otra regla.

Puedes descargar el ejemplo haciendo clic en el siguiente enlace: Descargar ejemplo

Desactivar y eliminar los autoguardados de un Post en WordPress

Cuando escribimos un Post en WordPress, automáticamente se van guardando diferentes versiones del mismo, pudiendo recuperar o volver a una versión anterior. Con el paso del tiempo puede suponer una merma en el rendimiento de nuestro sitio, ya que hará que nuestra base de datos crezca de forma considerable.

Para solucionar este problema, podemos optar por varias soluciones.

1. Desactivar de forma permanente el autoguardado automático. Para ello, abrimos el archivo wp-config.php y añadimos la siguiente línea de código:

define('WP_POST_REVISIONS', false);

2. Limitar el número de autoguardados que hace WordPress de cada Post; en esta ocasión tendríamos que añadir la siguiente línea de código a nuestro archivo wp-config:

define('WP_POST_REVISIONS', 3);

Modifica el valor para indicar el número máximo de autoguardados.

3. Aumentar el tiempo entre cada uno de los autoguardados. Añade la siguiente línea:

define('AUTOSAVE_INTERVAL', 600);

Modifica el valor indicado en segundos para ajustar el intervalo de tiempo. En este ejemplo se realizaría un autoguardado cada 10 minutos.

4. Limpiar todos los autoguardados que tengamos en nuestra base de datos. Accedemos a nuestra base de datos a través de phpmyadmin y escribimos la siguiente sentencia SQL:

DELETE FROM wp_posts WHERE post_type = 'revision';

Donde wp_ es el prefijo de nuestras tablas, por tanto si al hacer la instalación indicaste un prefijo personalizado, deberás cambiarlo también en la sentencia SQL.

Entradas populares

Sobre el autor

Mi foto

Me llamo Juan Ignacio Estévez. Soy técnico publicitario por el Centro Español de Nuevas Profesiones (CENP).

Comencé desarrollando mi carrera profesional en estudios de diseño y agencias de publicidad como director de arte, siempre enfocado al mundo Offline. Sin embargo, pronto sentí curiosidad por el Online. Desde entonces, he intentado formarme en este sector, a través de diferentes cursos de formación y de forma autodidacta.

Puedes ver mi perfil completo en LinkedIn. ¿Hacemos Networking?