¿Está buscando una manera de agregar un slug de página de WordPress a la clase de cuerpo de su tema?

Agregar un slug de página a su tema de WordPress le permite hacer toda la personalización que desee sin problemas. Puede cambiar fácilmente los colores, las fuentes y otros elementos específicos en función de páginas específicas.

En este artículo, le mostraremos cómo agregar un slug de página en la clase de cuerpo de un tema de WordPress.

¿Por qué agregar Page Slug a Body Class en tu tema?

Agregar un slug de página a la clase de cuerpo de su tema es útil si está buscando personalizar una página específica en su sitio y desea identificar correctamente la página.

De forma predeterminada, su sitio de WordPress solo mostrará la clase de ID de publicación, lo que puede ser complicado para identificar la página correcta. El slug de la página muestra la URL de la publicación de tu blog, lo que facilita la personalización de la página.

Aparte de eso, puede realizar diferentes personalizaciones en su página utilizando la clase de cuerpo de slug de página. Por ejemplo, puede cambiar la fuente y el color de una publicación específica o resaltar un botón de llamada a la acción en una página de destino específica.

Dicho esto, veamos cómo agregar un slug de página en la clase de cuerpo de un tema de WordPress.

Agregue Page Slug a su tema de WordPress

Para ayudarlo a agregar la URL de la página en la clase de cuerpo de su tema de WordPress, puede ingresar el siguiente código en el archivo functions.php de su tema.

//Page Slug Body Class
function add_slug_body_class( $classes ) {
global $post;
if ( isset( $post ) ) {
$classes[] = $post->post_type . '-' . $post->post_name;
}
return $classes;
}
add_filter( 'body_class', 'add_slug_body_class' );

Puede acceder al archivo functions.php de su tema a través del editor de temas de WordPress (editor de código). Sin embargo, editar archivos de temas directamente es muy peligroso.

Esto se debe a que cualquier error al agregar el código puede dañar su sitio web y evitar que inicie sesión en su panel de control de WordPress.

Una forma más fácil de agregar código a la clase de cuerpo del tema es usar un complemento de WordPress como Code Snippets.

Puede agregar fácilmente código a su sitio en minutos y usar el complemento sin ningún error. Además, garantiza que si actualiza o cambia el tema en el futuro, su código no se eliminará.

Primero, debe instalar y activar el complemento Code Snippets en su sitio. Para obtener más detalles, puede consultar nuestra guía sobre cómo instalar complementos de WordPress.

A continuación, puede navegar hasta Fragmento Desde tu panel de administración de WordPress. Después de eso, continúe y haga clic en el botón “Agregar nuevo”.

Agregar nuevo fragmento de código personalizado

Ahora, asigne un nombre a su fragmento e ingrese el código en la sección “Código”.

introducir fragmento de código

Después de agregar el código, no olvide hacer clic en el botón “Activar”. Para obtener más detalles, puede consultar nuestra guía sobre cómo agregar código personalizado en WordPress.

Ahora comenzará a ver una nueva clase de cuerpo que se ve así: página-{slug}. Utilice esta clase para anular sus estilos predeterminados y personalizar elementos para páginas específicas.

Por ejemplo, supongamos que desea diseñar un widget de barra lateral, pero solo en páginas con la pestaña “Educación”. En este caso, puede agregar CSS como este:

#sidebar .widgets{background: #fff; color: #000;}
.page-education #sidebar .widgets{background: #000; color: #fff;}

Para obtener más detalles, puede consultar nuestra guía sobre cómo agregar CSS personalizado a WordPress.

Esperamos que este artículo le haya ayudado a aprender cómo agregar un slug de página en la clase de cuerpo de su tema de WordPress. También puede consultar nuestra guía de clases de cuerpo de WordPress y cómo elegir el mejor software de diseño.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para videos tutoriales de WordPress.También puedes encontrarnos en Gorjeo y Facebook.

Los datos expuestos en este sitio web son de índole informativo, no necesariamente están actualizados. Esta información es una recopilación de información de internet.