Tutoriales de WordPress de Confianza, cuando más los necesitas.
Guía para Principiantes de WordPress
Copa WPB
25 Millones+
Sitios web que usan nuestros plugins
16+
Años de experiencia en WordPress
3000+
Tutoriales de WordPress de expertos

Cómo agregar código de encabezado y pie de página en WordPress (la forma fácil)

En WPBeginner, creamos muchos tutoriales que requieren que insertes código en las secciones <header> o <footer> de tu sitio de WordPress. Para muchos usuarios, esto puede ser intimidante, especialmente porque WordPress no tiene una forma integrada de insertar código en estas áreas.

Sin embargo, agregar código a tu encabezado y pie de página es esencial para integrar servicios populares como Google Analytics, Google Search Console, Píxel de Facebook y más. También podrías necesitar agregar CSS o JavaScript personalizados como parte de otros tutoriales de WordPress.

¿La buena noticia? No tienes que editar los archivos de tu tema directamente ni preocuparte por romper tu sitio. Usando el plugin gratuito WPCode, incluso los principiantes pueden agregar fragmentos de código a su encabezado o pie de página de forma segura y sencilla.

En esta guía, te explicaremos paso a paso cómo agregar código al encabezado y pie de página en WordPress.

Cómo agregar código de encabezado y pie de página en WordPress

La mejor manera de agregar código al encabezado y pie de página de WordPress

Si deseas agregar código al encabezado y pie de página de WordPress, existen tres soluciones posibles:

  1. Manualmente, editando los archivos header.php y footer.php de tu tema
  2. Con la función de código de encabezado y pie de página integrada de tu tema
  3. Usando un plugin de encabezados y pies de página para WordPress

La primera opción no es amigable para principiantes porque requiere que agregues código al encabezado y pie de página editando directamente los archivos header.php y footer.php de forma manual.

Otra desventaja de usar este método es que tu código se eliminará si instalas una actualización de tu tema.

La segunda opción es usar la función integrada de tu tema. Algunos temas de WordPress como Elegant Themes ofrecen una opción integrada para agregar rápidamente código y scripts al encabezado y pie de página de tu WordPress.

Si estás usando un tema con una función integrada, parece una solución segura y sencilla. Sin embargo, si cambias de tema, todos los fragmentos de código agregados a tu sitio web desaparecerán. Esto incluye la verificación del sitio en Google Search Console, análisis del sitio web a través de Google Analytics, y así sucesivamente.

Por eso siempre recomendamos a los usuarios que utilicen la tercera opción, un plugin de encabezados y pies de página. Esta opción es, con diferencia, el método más fácil y seguro para agregar código al encabezado y pie de página en WordPress.

Después de muchas solicitudes de nuestros lectores, nuestro equipo ha creado el plugin WPCode.

WPCode

WPCode (anteriormente llamado Insert Headers and Footers) es un plugin de fragmentos de código 100% gratuito. Puedes usarlo para agregar fácilmente código al encabezado y pie de página en WordPress.

Aquí hay algunos beneficios de usar el plugin WPCode:

1. 🚀 Fácil, Rápido y Organizado: Te permite agregar código al encabezado y pie de página de tu sitio de manera fácil y rápida. Además, te mantiene organizado al permitirte almacenar todos tus códigos de pie de página y encabezado en un solo lugar.

2. ✅ Previene Errores: La validación inteligente de fragmentos de código ayuda a prevenir errores que podrían ocurrir si editas los archivos de tu tema manualmente.

3. 😌 Actualiza o cambia tu tema sin preocupaciones: El plugin guardará el código de tu encabezado y pie de página en un lugar separado, por lo que puedes actualizar o cambiar tu tema sin preocuparte de que el código se borre.

Además de los scripts para encabezado y pie de página, también puedes usar WPCode para insertar fácilmente fragmentos de código PHP personalizado, JavaScript, CSS, HTML y texto sin editar los archivos de tu tema.

Además, WPCode tiene una biblioteca de fragmentos integrada donde puedes encontrar todos los fragmentos de código de WordPress más útiles. Esto te permite eliminar rápidamente las funciones de WordPress que no deseas, como las actualizaciones automáticas, la API REST, XML-RPC, comentarios y más.

Nota: El plugin gratuito WPCode tiene todo lo que necesitas para agregar código en el encabezado y pie de página en WordPress. Sin embargo, si deseas funciones avanzadas como una biblioteca de fragmentos en la nube privada, píxeles de conversión, fragmentos programados y más, puedes actualizar a WPCode Pro.

Para más detalles, lee nuestra guía sobre cómo agregar fácilmente código personalizado en WordPress.

Dicho esto, veamos cómo agregar fácilmente código en el encabezado y pie de página en WordPress usando el plugin WPCode.

Agregar código al encabezado y pie de página en WordPress

Lo primero que necesitas hacer es instalar y activar el plugin gratuito WPCode. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Una vez activado el plugin, ve a Fragmentos de código » Encabezado y pie de página desde tu panel de administración de WordPress. Después de eso, verás un cuadro de 'Encabezado' donde puedes agregar tu código.

Agrega código al encabezado y pie de página con WPCode

Si te desplazas hacia abajo, también verás un cuadro de 'Cuerpo' y un cuadro de 'Pie de página'.

Cuadros de scripts de encabezado y pie de página WPCode

Simplemente pega el código en uno de los tres cuadros. Una vez que hayas terminado, no olvides hacer clic en el botón 'Guardar cambios' para almacenar tu configuración.

El plugin ahora cargará automáticamente el código en las ubicaciones respectivas de tu sitio de WordPress.

Siempre puedes editar y eliminar cualquier código que ya no desees conservar.

Deberás mantener el plugin instalado y activado en todo momento. Desactivar el plugin detendrá la adición de todo el código personalizado a tu sitio.

Si desactivas el plugin accidentalmente, el código seguirá almacenado de forma segura en tu base de datos de WordPress. Simplemente puedes reinstalar o reactivar el plugin, y el código comenzará a aparecer de nuevo.

Nota: Es posible que debas limpiar la caché de tu WordPress después de guardar los cambios, para que el código aparezca correctamente en el front-end de tu sitio web.

Hemos encontrado que la razón principal por la que muchos principiantes usan el plugin WPCode es para agregar Google Analytics a su sitio web. Para eso, recomendamos usar el plugin gratuito MonsterInsights.

MonsterInsights es el mejor plugin de Google Analytics para WordPress. Te ayuda a configurar correctamente el seguimiento de Google Analytics con solo unos pocos clics, y te muestra estadísticas útiles directamente en tu panel de WordPress.

Para obtener instrucciones paso a paso, consulta este tutorial sobre cómo instalar Google Analytics en WordPress.

Tutorial en video

Si no disfrutas siguiendo instrucciones escritas, puedes ver nuestro video tutorial sobre cómo agregar código de encabezado y pie de página en WordPress:

Suscríbete a WPBeginner

Esperamos que este artículo te haya ayudado a aprender cómo agregar código de encabezado y pie de página en WordPress fácilmente. También podrías querer ver nuestra guía sobre cómo mostrar código en tu sitio de WordPress, o nuestras selecciones expertas de las mejores herramientas de desarrollo de WordPress.

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

Descargo de responsabilidad: Nuestro contenido es compatible con el lector. Esto significa que si haces clic en algunos de nuestros enlaces, podemos ganar una comisión. Consulta cómo se financia WPBeginner, por qué es importante y cómo puedes apoyarnos. Aquí está nuestro proceso editorial.

El Kit de herramientas definitivo para WordPress

Obtén acceso GRATUITO a nuestro kit de herramientas: ¡una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Interacciones del lector

267 CommentsLeave a Reply

    • Deberías consultar con el soporte de tu tema específico para el encabezado que no aparece en una página específica, ya que podría ser una plantilla específica de la página la que te cause problemas.

      Administrador

  1. ¡Gracias chicos por su plugin! Lo usé para agregar el Pixel de FB a mi sitio, pero ahora tengo una página de destino y necesito un evento de Pixel diferente (Lead) en la página de agradecimiento después de que los visitantes confirmen sus datos. ¿Puedo usar el plugin para agregar el script a una página específica?

  2. Hola, ¿hay alguna forma de cambiar el tamaño de la fuente del pie de página?
    Intenté escribir un fragmento de texto de exención de responsabilidad, pero es demasiado grande.

    ¡Gracias de antemano!

    • Es posible que desees asegurarte de haber borrado cualquier caché en tu sitio, ya que es una de las razones más comunes

      Administrador

  3. Necesitas cambiar tu mensaje/publicidad sobre que el plugin de encabezado/pie de página es gratuito para instalar. No es gratuito a menos que hayas comprado el plan Business para tu página.

  4. ¿Cuántos códigos podemos agregar en una sola sección de encabezado o pie de página? Es decir, ¿puedo usar dos o tres códigos en una sola sección de encabezado como código de Facebook, código de Google, etc.?

    • Ciertamente podrías agregar tantos códigos como necesites en la sección de encabezado, dependiendo de tus necesidades.

      Administrador

  5. Me preguntaba si se puede agregar PHP en la sección de encabezado. Como agregar el código de Breadcrumb de Yoast al encabezado para no tener que ir a los archivos de mi tema.

  6. ¿Puedes agregar más de un código de encabezado al plugin, por ejemplo
    código de AdSense y código de verificación de YouTube.

  7. Hola, estoy intentando agregar un javascript al encabezado de mi sitio, pero al hacer clic en guardar dice que la página no se encuentra

    • Es posible que desees intentar guardar de nuevo tus permalinks y verificar con tu proveedor de hosting que no estén recibiendo un error en tu sitio que impida que la página se guarde.

      Administrador

    • Si el plugin está instalado, deberías poder agregar el código en Configuración>Insertar Encabezados y Pies de Página

      Administrador

  8. Hola. Ya instalé el plugin y funciona. Pero, ¿cómo agrego más de 1 código? ¿Solo lo copio así o necesito dejar 1 espacio para copiar el código?

    • En caso de que necesites editar el código más tarde, normalmente es mejor agregar el nuevo código en la siguiente línea

      Administrador

  9. No se puede actualizar el plugin "Insert Headers and Footers".
    Mensaje de error: Error de actualización: No es posible eliminar la versión anterior del plugin. (traducción del español)

    Al intentar eliminar el plugin: "insert-headers-and-footers-old/ihaf.php no se pudo eliminar por completo." (traducción del español)

  10. Hola,

    Después de insertar el código del Encabezado, cuando hago clic en “guardar”, se enlaza automáticamente al error de la página 404. ¿Cómo puedo solucionarlo?

  11. Tengo otro plugin que parece funcionar de manera casi idéntica, solo que se puede usar en una sola página o personalizar en qué páginas se agrega el script.

    Estoy probando el plugin de WpBeginner solo porque confío en ustedes.

    ¿Es probable que tenga problemas al agregar ambos a mi sitio?

    ¿Usar el tuyo para todo el sitio y el otro para agregar algo solo al encabezado o pie de página de una página individual?

  12. Hola,
    Estoy intentando actualizar algo en la sección de mi pie de página.
    Ya he descargado e instalado/usado este complemento anteriormente y está funcionando actualmente. Sin embargo, cuando intento editarlo, cuando mi cursor está sobre la configuración... no aparece ningún menú desplegable para ir a -> insertar encabezado y pie de página. Solo me lleva a la página de configuración de mi cuenta. ¡Por favor, ayúdenme porque necesito actualizar mis opciones de lista de correo lo antes posible! ¡Gracias!

    • Si vas a tu área de configuración, debería expandirse para mostrarte otras opciones y que puedas ver el elemento del menú "Insertar encabezados y pies de página".

      Administrador

  13. Gracias WPbeginner,

    Intenté guardar el plugin cuando agregué mi código de consola de búsqueda de Google, me redirigió a un error 404.

    ¿Qué podría estar mal?

  14. ¿Debo desactivar y eliminar el plugin después de insertar el código?

    ¿Se eliminará el código tan pronto como se desactive el plugin?

  15. Hola. He estado usando este plugin por algún tiempo y lo encuentro invaluable.
    Sin embargo, estoy a punto de actualizar a WordPress 5 pero en la página de descarga, dice ‘Compatible hasta 4.9.9’. Esto me pone receloso – ¿funcionará con la versión 5 y hay planes para actualizarlo? Gracias.

  16. Hola,

    Gracias por recomendar el plugin Header and Footer, y he agregado código a una sola publicación para prevenir cualquier problema.

    Sin embargo, he notado que mi menú desplegable ha dejado de mostrarse (solo en la página con el código). ¿Tienes una solución de Javascript, por favor?

    http://www.phhsolicitors.co.uk/calc/

    Espero que puedas ayudar.

    ¡¡¡Feliz Navidad!!!!

  17. Lo he agregado a mi sitio. Lo lee bien, pero imprime el código en la parte superior de mi barra de encabezado ¡¡¡CADA VEZ!!! No estoy seguro de cómo solucionar esto.

  18. Por favor, explica en detalle cómo agregar más de un código en el espacio de encabezado, porque ya inserté el código de Google Search Console con el plugin, ¿cómo voy a agregar el código de AdSense en la misma sección de encabezado?

    • Agregarías el nuevo código en la siguiente línea, como si copiaras todo el código para cada uno, deberían cerrarse solos.

      Administrador

  19. ¿Cómo agrego un código HTML en el encabezado de mi tema? No entiendo bien dónde está. Uso Xtheme y algunas personas dijeron que fuera a Apariencia y Editor, pero no tengo ningún editor.

    Necesito agregar el Gtag en el encabezado de mi sitio web para Google Analytics y no quiero usar un plugin

  20. Quiero preguntarte sobre este plugin.
    ¿Puedo poner más de un código de diferentes sitios (por ejemplo, código de Google Analytics, código de Webmaster y código de anuncio de AdSense)? ¿Afectará el número de códigos su rendimiento porque veo una diferencia en términos de visitantes entre Google Analytics y las analíticas de WordPress (WP Statistics)?
    ¿Y la diferencia entre colocar el código en el encabezado y en el pie de página?
    Gracias, disculpa la molestia.
    Espero que respondas rápidamente.

  21. Hola, ¿es posible usar este plugin para agregar más scripts? Por ejemplo, necesito agregar los códigos de AdSense y PushCrew.

    Si es posible, ¿simplemente copio el código uno debajo del otro?

    Gracias

  22. Hasta ahora todo bien. He estado tratando de buscar en tu sitio códigos para insertar saltos de línea y centrar texto. ¿Alguna URL para estas explicaciones?

  23. Muchas, muchas gracias. Eso resolvió mi problema. También me gustaría saber si hay alguna forma de solucionar el código de error que obtengo en los códigos de mi tema. Tengo 53 errores cuando veo el código fuente.

  24. Desearía que esto estuviera disponible para Cuentas Premium, así como para Business. ¿Hay otra forma de incrustar código en tu sitio?

  25. He instalado el plugin de encabezado y pie de página, he introducido el código relevante y lo he guardado. Cuando miro en el script del encabezado en el editor de encabezados, no veo el código relevante que acabo de introducir. Por favor, aconséjeme.
    Gracias.

  26. Cuando intento agregar código al encabezado usando el plugin, obtengo una página de error 403 Forbidden. ¿Cómo puedo evitar esto? Intenté desactivar temporalmente mi seguridad, pero eso no ayudó.

  27. Hola, estoy buscando una opción como esta pero para una red multisitio,

    pero lo que necesito es como un administrador general para la opción de toda la red,
    donde cuando configuro esto, se mostrará en el encabezado de todos los sub-sitios,

    actualmente, necesito configurar esto para la configuración del plugin de cada sub-sitio.

    ¿Hay alguna forma de tener la opción del plugin de este menú bajo la opción de red o algo así y no por sub-sitio?

    ¿Hay alguna otra opción que pueda usar/hacer?

    gracias

  28. Oye, ¿hay alguna manera de verificar si el código se ha insertado? No puedo detectarlo en el código fuente de mi sitio ni en el archivo headers.php. ¿Es posible que este plugin no esté funcionando?

    • Hola Riddhi,

      Una vez que agregues el código y guardes tus cambios, podrás ver el código en el código fuente de tu sitio. Para el código del encabezado, lo encontrarás entre las etiquetas <head> y </head>. El código del pie de página se agregará antes de la etiqueta </body>.

      Administrador

  29. ¿Hay alguna forma de usar esto para agregar una imagen en el encabezado que no reemplace el encabezado existente? En otras palabras, ya tengo un logotipo allí a la izquierda, y una barra de búsqueda con enlaces a redes sociales a la derecha. El centro está vacío. Quiero agregar un widget de imagen que enlace a la página de origen de la imagen. Tengo el código del widget listo para insertar, pero no hay HTML visible en el archivo header.php. No sé PHP (sí sé HTML bastante bien).
    Agregué el widget al pie de página, lo cual fue fácil porque en mi tema SÍ hay HTML (una tabla HTML) en el pie de página. Pero se supone que debe estar en la parte superior de las páginas.

  30. Muchas gracias por la información. He tenido muchos problemas para pegar el código de AdSense en HTML en el encabezado. Esta información me ayuda mucho.

  31. Entonces, ¿puedo deshabilitar esta notificación después de instalarla en cualquier lugar?
    ¡¡No necesito que todos mis clientes multisitio vean esta notificación!!

  32. Hola, acabo de volver a agregar mi código incrustado del widget de pie de página, es de keyreply.
    No sé qué salió mal, podía ver mi widget de pie de página desde mi PC (mientras estoy conectado en WP), sin embargo, en cualquier otro dispositivo (PC o teléfono móvil), el widget no se muestra. ¿Alguna idea?

  33. Instalé el plugin Insert Headers and Footers en el sitio de WordPress de mi cliente, pero cuando hago clic en él en Configuración, solo muestra una página en blanco. No hay campos disponibles para que inserte texto.

  34. Hola,
    Estoy intentando instalar un anuncio de banner html5 en la parte superior de mi página de inicio y en la parte superior de algunas otras páginas. Tengo un cliente que solo quiere entregar su anuncio de banner en ese formato, de modo que como un banner giratorio, cada imagen enlace a una URL diferente que estamos promocionando. ¿Dónde pongo este código para que aparezca? He intentado descargar algunos complementos para colocarlo, pero nada funciona. Normalmente solo aceptamos jpgs y enlaces, pero no quiero perder esta venta, ya que ella no entregará nada que no sea en html5. ¡Gracias por tu ayuda! Geraldine

  35. Hola, me encanta la simplicidad de este plugin. Sin embargo, hay un punto molesto.

    ¿Cómo puedo deshabilitar la notificación del panel "Gracias por instalar..." en una configuración multisitio.

    No necesito que todos los sitios de mis clientes vean esa notificación.

    Se agradecería una solución que no implique otro plugin, preferiblemente que pueda eliminar una acción o algo así.

Deja una respuesta

Gracias por elegir dejar un comentario. Ten en cuenta que todos los comentarios son moderados de acuerdo con nuestra política de comentarios, y tu dirección de correo electrónico NO será publicada. Por favor, NO uses palabras clave en el campo del nombre. Tengamos una conversación personal y significativa.