Tema clásico 02: style.css y functions.php con criterio

Aprende a usar style.css y functions.php como contrato técnico del tema: identidad, capacidades y arranque limpio.

En un tema clásico, style.css y functions.php son mucho más que archivos iniciales: definen la identidad y el comportamiento base del proyecto.

Si están mal planteados, aparecen problemas de compatibilidad, traducción, menús o miniaturas en fases muy avanzadas.

La idea es usar style.css como contrato de metadatos y functions.php como punto de arranque ordenado, no como cajón de sastre.

En esta lección vas a registrar soportes de tema, menú principal y dominio de traducción con una estructura limpia.

  • WordPress detecta el tema por la cabecera de style.css; sin eso, el tema ni siquiera existe para el panel.
  • La cabecera debe incluir Theme Name, Version, Text Domain y datos coherentes con la realidad del proyecto.
  • Aunque luego cargues CSS principal desde assets/css/main.css, style.css sigue siendo obligatorio como descriptor del tema.
  • Mantén en style.css solo reset mínimo o imports justificados; evita convertirlo en un archivo gigante sin estructura.
  • Metadatos limpios y versionado consistente.

style.css: metadatos y responsabilidad real

WordPress detecta el tema por la cabecera de style.css; sin eso, el tema ni siquiera existe para el panel.

La cabecera debe incluir Theme Name, Version, Text Domain y datos coherentes con la realidad del proyecto.

Aunque luego cargues CSS principal desde assets/css/main.css, style.css sigue siendo obligatorio como descriptor del tema.

Mantén en style.css solo reset mínimo o imports justificados; evita convertirlo en un archivo gigante sin estructura.

  • Metadatos limpios y versionado consistente.
  • Text Domain alineado con slug del tema.
  • Nada de copiar cabeceras de otro proyecto.
  • Revisión antes de cada release.

functions.php: setup del tema sin mezclar responsabilidades

Define capacidades en after_setup_theme y evita ejecutar lógica pesada en carga global.

after_setup_theme es el hook correcto para registrar soportes del tema como title-tag, post-thumbnails y HTML5.

Si necesitas internacionalización, carga el dominio de traducción también en ese setup inicial.

Registra menús desde el arranque y deja claro qué ubicación usará cada plantilla del tema.

WordPress Themes Pro
12

Tema clásico 02: style.css y functions.php con criterio

Aprende a usar style.css y functions.php como contrato técnico del tema: identidad, capacidades y arranque limpio.

Código del tema: after_setup_theme

📘 Teoría

style.css: metadatos y responsabilidad real

WordPress detecta el tema por la cabecera de style.css; sin eso, el tema ni siquiera existe para el panel.

La cabecera debe incluir Theme Name, Version, Text Domain y datos coherentes con la realidad del proyecto.

Aunque luego cargues CSS principal desde assets/css/main.css, style.css sigue siendo obligatorio como descriptor del tema.

Mantén en style.css solo reset mínimo o imports justificados; evita convertirlo en un archivo gigante sin estructura.

  • Metadatos limpios y versionado consistente.
  • Text Domain alineado con slug del tema.
  • Nada de copiar cabeceras de otro proyecto.
  • Revisión antes de cada release.

functions.php: setup del tema sin mezclar responsabilidades

Define capacidades en after_setup_theme y evita ejecutar lógica pesada en carga global.

1

after_setup_theme es el hook correcto para registrar soportes del tema como title-tag, post-thumbnails y HTML5.

2

Si necesitas internacionalización, carga el dominio de traducción también en ese setup inicial.

3

Registra menús desde el arranque y deja claro qué ubicación usará cada plantilla del tema.

🧪 Aprende probando

Ejemplo Ejemplo: cabecera correcta en style.css Bloque mínimo de metadatos para identificar el tema de forma consistente.

🏁 Retos

Reto Reto: completar setup del tema Añade soporte de miniaturas y registro de menú principal en after_setup_theme.

🧰 Recursos

Test

Comprueba tus conocimientos con un test sobre WordPress Themes Pro.

Test de WordPress Themes Pro

¿Qué es esto?

Soy Cristian Eslava y a veces hago webs para procrastinar yo y vosotros. culTest

La hice en febrero de 2026 para facilitar el aprendizaje de mis alumnos. La idea es aprender desarrollo web practicando y que el proyecto siga creciendo con nuevos temas, tests y retos.

Está inspirada en MDN, W3Schools, CodePen, Manz y muchos otros sitios de documentación sobre desarrollo web. Quería combinar teoría útil, ejemplos ejecutables, retos y el sistema de tests que ya tenía en culTest. culTest

Si te gustó, si no te gustó o si quieres escribirme, puedes hacerlo en cristianeslava@gmail.com