{}
Aprende diseño y desarrollo web
Cursos gratuitos interactivos

Tema clásico 03: enqueue de assets sin conflictos

Implementa una carga de CSS/JS sólida en temas clásicos con dependencias, versionado y activación por contexto.

En un tema clásico, muchos bugs de frontend no nacen en el CSS o en el JavaScript, sino en cómo los cargas.

Cuando encolas sin orden ni dependencias, aparecen scripts duplicados, errores intermitentes y conflictos con plugins.

La solución profesional es usar siempre el sistema de enqueue, declarar dependencias reales y versionar los archivos correctamente.

También debes evitar carga global innecesaria: si un script solo sirve para una plantilla, no debe viajar en todo el sitio.

  • enqueue no es opcional: es la capa que coordina assets entre núcleo, plugins y tema.
  • Cada archivo debe tener un handle único y descriptivo para facilitar depuración y mantenimiento.
  • Declara dependencias explícitas en scripts para que WordPress gestione el orden correcto sin hacks manuales.
  • Versiona assets con filemtime en desarrollo para invalidar caché al instante y usa versión fija en release.
  • Nunca hardcodees etiquetas <script> en header.php.

Principios de carga en tema clásico

enqueue no es opcional: es la capa que coordina assets entre núcleo, plugins y tema.

Cada archivo debe tener un handle único y descriptivo para facilitar depuración y mantenimiento.

Declara dependencias explícitas en scripts para que WordPress gestione el orden correcto sin hacks manuales.

Versiona assets con filemtime en desarrollo para invalidar caché al instante y usa versión fija en release.

  • Nunca hardcodees etiquetas <script> en header.php.
  • Un módulo, un handle, una responsabilidad.
  • Scripts no críticos en footer cuando aplique.
  • Nombra recursos con convención estable del tema.

Implementación base en functions.php

Carga CSS principal y JS de navegación con versión coherente y sin duplicados.

Carga contextual por plantilla

No cargues módulos avanzados en páginas que no los usan.

Si una funcionalidad solo existe en una landing o en un CPT, actívala con is_page_template o is_singular.

Esto reduce transferencias innecesarias y mejora métricas de render en vistas simples.

Mantén un inventario de assets por feature para que el equipo sepa dónde se activa cada archivo.

WordPress Themes Pro
13

Tema clásico 03: enqueue de assets sin conflictos

Implementa una carga de CSS/JS sólida en temas clásicos con dependencias, versionado y activación por contexto.

¿Cuánto sabes de WordPress Themes Pro?

Código del tema: wp_enqueue_style

📘 Teoría

Principios de carga en tema clásico

enqueue no es opcional: es la capa que coordina assets entre núcleo, plugins y tema.

Cada archivo debe tener un handle único y descriptivo para facilitar depuración y mantenimiento.

Declara dependencias explícitas en scripts para que WordPress gestione el orden correcto sin hacks manuales.

Versiona assets con filemtime en desarrollo para invalidar caché al instante y usa versión fija en release.

  • Nunca hardcodees etiquetas en header.php.
  • Un módulo, un handle, una responsabilidad.
  • Scripts no críticos en footer cuando aplique.
  • Nombra recursos con convención estable del tema.

Implementación base en functions.php

Carga CSS principal y JS de navegación con versión coherente y sin duplicados.

Carga contextual por plantilla

No cargues módulos avanzados en páginas que no los usan.

1

Si una funcionalidad solo existe en una landing o en un CPT, actívala con is_page_template o is_singular.

2

Esto reduce transferencias innecesarias y mejora métricas de render en vistas simples.

3

Mantén un inventario de assets por feature para que el equipo sepa dónde se activa cada archivo.

🧪 Aprende probando

Ejemplo Ejemplo: pasar datos seguros a JS Usa wp_localize_script para enviar ajaxUrl y nonce sin hardcodear rutas en JavaScript.
⌄

🏁 Retos

Reto Reto: limitar un script a single de producto Completa la condición para no cargar el script en todo el sitio.
⌄

🧰 Recursos

Enlaces útiles

Including CSS & JavaScript wp_enqueue_script() wp_enqueue_style() wp_localize_script()
Test

Comprueba tus conocimientos con un test sobre WordPress Themes Pro.

Test de WordPress Themes Pro
Recursos del curso 30
📘 Glosario 🖼️ Infografías 🎬 Vídeos 🔗 Enlaces
‹
Lección 12
Tema clásico 02: style.css y functions.php con criterio
Lección 14
Tema clásico 04: header, footer y sidebar bien desacoplados
›

¿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