• Saltar a la navegación principal
  • Saltar al contenido principal
Código Genesis

Código Genesis

Tutoriales de WordPress y Genesis Framework

  • Empieza aquí
  • Cuenta
    • Suscripción
    • Perfil
    • Actualizar tarjeta
    • Favoritos
    • Salir
  • Suscribirse
  • Acceder

Añadir etiquetas como clases CSS en WordPress

Descubre en este tutorial de Genesis Framework cómo introducir las etiquetas como clases CSS personalizadas en WordPress mediante código.

WordPress ofrece varias clases CSS para ayudar a maquetar algunas páginas, por ejemplo:

  • .archive
  • .single
  • .single-portfolio
  • .post-type-archive-portfolio

Pero, ¿y si estos estilos predefinidos no son suficientes y necesitas algo más específico?

En ese caso, la mejor solución es crear una clase CSS personalizada.

A parte de asignar estilos propios a las categorías, también tienes la opción de añadir una clase CSS a las etiquetas. De esta forma puedes maquetar de la misma forma todos los posts, productos o cursos que estén marcados con una etiqueta concreta.

Descubre cómo hacerlo:

Snippet para insertar etiquetas como clase CSS en WordPress

Añade la siguiente línea en functions.php:

Para ver este código y los otros 1827 snippets de esta web,
identifícate o suscríbete aquí.

Este fragmento te permite usar el selector CSS «.etiqueta-1», «.etiqueta-2»… para aplicar estilos específicos a los posts o CPTs dentro de esa taxonomía.

Conclusiones

Si asignas una clase CSS a una etiqueta te será muy fácil mantener un estilo uniforme en la web y, por el mismo precio, ahorrarás tiempo a la hora de maquetar esos posts o CPTs tal y como deseas.

Mejor aún, ahora ya sabes cómo hacerlo con un simple snippet de código. 😉

¿Tienes alguna pregunta o quieres darme una sugerencia para próximos tutoriales de Genesis Framework? Cuéntamela en los comentarios.

Ventajas de ser suscriptor. 😉  

CSS Entrada PHP WordPress

Nahuai Badiola

Desarrollador web especializado en WordPress y Genesis Framework. CEO de Código Genesis y cofundador de OsomPress (temas y plugins para WordPress).

Para dejar dudas o preguntas sobre este código, puedes identificarte o suscribirte.

  • Empieza aquí
  • Sobre Código Genesis
  • Preguntas frecuentes
  • Contacto

Aviso legal · Política de privacidad · Política de cookies · Condiciones de contratación
Copyright © 2023 · Código Genesis

¿Has olvidado tu contraseña?