Cómo editar HTML en el Editor de código de WordPress (Guía para principiantes)

¿Busca una manera fácil de editar HTML en su sitio de WordPress?

El lenguaje de marcado de hipertexto, o HTML, es un código que le dice a los navegadores web cómo mostrar contenido en sus páginas web. La edición de HTML es útil para la personalización avanzada y la resolución de problemas.

En este artículo, le mostraremos cómo editar HTML en el editor de código de WordPress utilizando diferentes métodos.

¿Por qué editar HTML en WordPress?

WordPress ofrece miles de temas y complementos para cambiar el aspecto de su sitio web y personalizar varios elementos sin tocar una sola línea de código.

Sin embargo, los complementos y los temas tienen sus limitaciones y es posible que no proporcionen la funcionalidad exacta que está buscando. Por lo tanto, es posible que no pueda diseñar su sitio web de la manera que desea.

La edición de HTML es realmente útil aquí. Puede realizar fácilmente una personalización avanzada utilizando código HTML. Proporciona mucha flexibilidad y control sobre cómo se ve y funciona su sitio web.

Además, aprender a editar HTML también puede ayudarlo a identificar y corregir errores en su sitio de WordPress cuando no puede acceder al tablero.

notas: Si no desea editar HTML, pero aún necesita opciones de personalización completas, le recomendamos que utilice un generador de páginas de WordPress de arrastrar y soltar, como SeedProd.

Habiendo dicho eso, veamos las diferentes formas de editar HTML en un sitio de WordPress.

Veremos cómo editar HTML usando el editor de bloques y el editor clásico, y le mostraremos una manera fácil de agregar código a su sitio. Puede ir a la sección que desee haciendo clic en el siguiente enlace.

• Cómo editar HTML en el Editor de bloques de WordPress
• Cómo editar HTML en el editor clásico de WordPress
• Cregsvr³ mo editor HTML y widgets de WordPress
• Cómo editar HTML en el editor de temas de WordPress
• Cómo editar HTML en WordPress usando FTP
• La manera fácil de agregar código a WordPress

Cómo editar HTML en el Editor de bloques de WordPress

Hay varias formas en el Editor de bloques de WordPress para editar el HTML de su publicación o página.

Primero, puede usar bloques HTML personalizados en su contenido para agregar código HTML.

Para comenzar, vaya a su tablero de WordPress y agregue una nueva publicación / página o edite una existente. Luego haga clic en el signo más (+) en la esquina superior izquierda y agregue el bloque "HTML personalizado".

Luego continúe e ingrese su código HTML personalizado en el bloque. También puede hacer clic en la opción Vista previa para verificar si el código HTML funciona correctamente y cómo se verá su contenido en su sitio en vivo.

Otra forma de agregar o cambiar el código HTML en el editor de bloques de WordPress es editar el HTML de un bloque específico.

Para ello, simplemente selecciona un bloque existente en tu contenido y haz clic en el menú de tres puntos. Luego continúe y haga clic en la opción "Editar como HTML".

Ahora verá HTML para un bloque. Continúe y edite el HTML del contenido. Por ejemplo, puede agregar enlaces nofollow, cambiar estilos de texto o agregar otro código.

Si desea editar el HTML de toda la publicación, puede usar el Editor de código en el Editor de bloques de WordPress.

Puede acceder al editor de código haciendo clic en la opción de tres puntos en la esquina superior derecha. Luego seleccione "Editor de código" de las opciones desplegables.

Cómo editar HTML en el editor clásico de WordPress

Si usa el editor clásico de WordPress, puede editar HTML fácilmente en la vista de texto.

Para acceder a la vista de texto, simplemente edite una publicación de blog o agregue una nueva. Cuando esté en el editor clásico, haga clic en la pestaña Texto para ver el HTML del artículo.

A continuación, puede editar el HTML del contenido. Por ejemplo, puede poner en negrita diferentes palabras para enfatizar, cursiva, crear listas, agregar contenido y más.

Cregsvr³ mo editor HTML y widgets de WordPress

¿Sabía que puede agregar y editar código HTML en el área de gadgets de su sitio web?

En WordPress el uso de Los widgets HTML personalizados pueden ayudarlo a personalizar las barras laterales, los pies de página y otras áreas de los widgets. Por ejemplo, puede insertar formularios de contacto, Google Maps, CTA y más.

Puede comenzar yendo al panel de administración de WordPress, luego vaya a Apariencia » WidgetsLuego continúe y agregue un widget HTML personalizado haciendo clic en el botón Agregar.

Luego, debe elegir dónde desea agregar su widget HTML personalizado y elegir una ubicación. El área de widgets dependerá del tema de WordPress que esté utilizando. Por ejemplo, puede agregarlo a un pie de página, encabezado u otra área.

Después de seleccionar el área y la ubicación del widget, continúe y haga clic en el botón "Guardar widget".

Luego puede hacer clic en el widget HTML personalizado, ingresar el código HTML y hacer clic en el botón Guardar.

Ahora puede visitar su sitio web para ver el widget HTML personalizado en acción.

Cómo editar HTML en el editor de temas de WordPress

Otra forma de editar HTML en tu sitio web es a través del editor de temas de WordPress (editor de código).

Sin embargo, no recomendamos editar el código directamente en el editor de temas. El más mínimo error al ingresar el código puede arruinar su sitio web y evitar que acceda al panel de control de WordPress.

Además, si actualiza el tema, todos sus cambios se perderán.

Sin embargo, si está considerando editar HTML con un editor de temas, es una buena idea hacer una copia de seguridad de su sitio antes de realizar cambios.

entonces vete Apariencia »Editor de temas desde tu panel de WordPress. Ahora verá un mensaje de advertencia para editar directamente el archivo del tema.

Después de hacer clic en el botón "Entiendo", verá su tema y archivo de código. Desde aquí puede seleccionar el archivo para editar y realizar cambios.

Cómo editar HTML en WordPress usando FTP

Otra alternativa a la edición de HTML en los archivos de temas de WordPress es usar FTP, también conocido como el servicio de Protocolo de transferencia de archivos.

Esta es una característica estándar que viene con todas las cuentas de alojamiento de WordPress.

La ventaja de utilizar FTP en lugar de un editor es que puede solucionar fácilmente los problemas utilizando un cliente FTP. De esta manera, no se quedará sin acceso a su panel de control de WordPress si algo sale mal mientras edita su HTML.

Para comenzar, primero debe seleccionar el software FTP. Usaremos FileZilla para este tutorial porque es un cliente FTP gratuito y fácil de usar para Windows, Mac y Linux.

Después de seleccionar su cliente FTP, ahora debe iniciar sesión en el servidor FTP en su sitio. Puede encontrar sus datos de inicio de sesión en el panel de control del panel de control de su proveedor de alojamiento.

Una vez que haya iniciado sesión, verá las diversas carpetas y archivos en su sitio web en la columna Sitio remoto. Continúe y vaya a su archivo de tema desde wp-content »tema.

Ahora verá varios temas en su sitio web. Continúe y seleccione el tema que desea editar.

A continuación, puede hacer clic con el botón derecho en el archivo del tema para editar el HTML. Por ejemplo, si desea cambiar el pie de página, haga clic con el botón derecho en el archivo footer.php.

Muchos clientes FTP le permiten ver y editar archivos y cargarlos automáticamente después de realizar cambios. En FileZilla, puede hacer esto haciendo clic en la opción Ver/Editar.

Sin embargo, le recomendamos que descargue el archivo que desea editar en su escritorio antes de realizar cualquier cambio.

Después de editar el HTML, puede reemplazar el archivo original. Para obtener más detalles, le recomendamos que siga nuestra guía sobre cómo cargar archivos de WordPress a través de FTP.

La manera fácil de agregar código a WordPress

La forma más fácil de agregar código a WordPress es usar el complemento Insertar encabezado y pie de página de WordPress.

El equipo de AprenderWP creó este complemento para que pueda agregar fácilmente código a su sitio web en minutos, y lo hicimos 100% gratis.

También ayuda a organizar su código porque se almacena en un solo lugar. También evita errores que pueden ocurrir al editar manualmente el código.

Algo más La ventaja es que si decides actualizar o cambiar el tema, no tienes que preocuparte de que se elimine el código.

Lo primero que debe hacer es instalar y activar el complemento Insertar encabezado y pie de página en su sitio web. Para obtener más detalles, puede seguir nuestro tutorial detallado sobre cómo instalar complementos de WordPress.

Una vez activado el complemento, puede ir a Ajustes »Insertar encabezado y pie de página desde tu panel de administración.

Luego puede agregar código HTML a su sitio web en los campos de encabezado, cuerpo y pie de página.

Por ejemplo, suponga que desea mostrar una barra de advertencia en su sitio web. Todo lo que tiene que hacer es ingresar el código HTML en el campo "Script en el cuerpo" y hacer clic en el botón "Guardar".

Además, puede usar el complemento para agregar el código de seguimiento de Google Analytics y los píxeles de Facebook en el encabezado o Pinterest en el pie de página de su sitio web.

Para obtener más detalles, puede consultar nuestra guía sobre cómo agregar código de encabezado y pie de página a WordPress.

Esperamos que este artículo le haya ayudado a aprender a editar HTML en el Editor de código de WordPress. También puedes echar un vistazo a nuestra guía sobre cuánto cuesta realmente crear un sitio de WordPress o conocer las principales razones por las que deberías usar WordPress en tu sitio web.

Si te ha gustado este artículo, suscríbete a nuestro canal de tutoriales en vídeo de YouTube para WordPress. También puede encontrarnos en Twitter y Facebook.