Cómo usar el bloque HTML HTML de WordPress

El bloque HTML personalizado le permite agregar contenido HTML y editarlo sin tener que ver la página o publicar como HTML. Puede incorporar HTML e incluso usarlo para marcar su texto y luego puede convertirlo en un bloque de párrafo de texto estilizado si lo desea. Este bloque es excelente para aquellos que prefieren trabajar en HTML y es una de las mejores formas de incorporar ciertos tipos de código, como Google Maps. En este artículo, analizaremos cuidadosamente el bloque HTML personalizado. Veremos cómo agregarlo a sus publicaciones y páginas, analizaremos su configuración y opciones, veremos consejos sobre cómo usarlo y ver preguntas frecuentes.
Suscríbase a nuestro canal de YouTube cómo agregar un bloque HTML personalizado a su publicación o página.

Para agregar el bloque HTML personalizado a su contenido, coloque el cursor donde desea el bloque y seleccione la herramienta Inserter. Se abrirá un cuadro de búsqueda donde puede ingresar una hora de búsqueda o ejecutar las opciones. Busque html y seleccione el bloque cuando se muestra en los resultados.

Alternativamente, puede clave / HTML donde desea que aparezca el bloque y presione Entrar o seleccionarlo de las opciones sobre el área de bloque.

Ahora tiene un bloque HTML personalizado en su contenido, donde puede agregar HTML. Veremos algunos ejemplos con código a medida que pasamos por la configuración.
Configuración y opciones de bloqueo HTML HTML

A diferencia de la mayoría de los bloques, el bloque HTML personalizado no incluye opciones en la barra lateral del editor. Encontrará todas las opciones que necesita en la barra de herramientas. La barra de herramientas de bloqueo HTML personalizada

Haga clic en cualquier parte del bloque para ver sus herramientas. Si no los ve a todos, haga clic en el bloque en una nueva área, y luego se mostrará el resto de las herramientas al seleccionar el bloque nuevamente. Cada bloque tiene sus propias comprobaciones específicas en las que puede seleccionar opciones para el bloque. Un pequeño conjunto de opciones de bloque sobre la barra de herramientas le permite cambiar el tipo de bloque, convertir en bloques y abrir las opciones.
Analicemos cada conjunto en detalle. Estilo de cambio HTML de bloque o personalizado

La selección de HTML en las opciones abre una caída en la que puede convertir el bloque en otros tipos de bloques. Las opciones incluyen código, columnas o grupo. Código: transforma el bloque HTML personalizado en un bloque de código para que pueda mostrar diferentes tipos de código. Columnas: coloque el bloque en columnas. Grupo: agregue el bloque a un grupo para que pueda ajustarlos como un solo bloque. Herramienta de bloqueo de bloques HTML personalizados

La herramienta de tiro incluye seis puntos que puedes agarrar con el mouse para moverla.

Luego, simplemente tire del bloque donde desee en su contenido y colóquelo. Aparecerá una línea azul que indique el lugar donde se reducirá el bloque mientras tira del bloque a su alrededor.

Después de ver que la línea azul aparece donde desea el bloque, suelte el botón del mouse y su bloque se colocará en su nueva ubicación. Mover bloque HTML personalizado

Las flechas hacia arriba y hacia abajo mueven el bloque con una sección de contenido cada vez que hace clic en ellas. La pantalla se ejecutará a medida que el bloque se mueva automáticamente a su nueva ubicación. Esta es una manera fácil de mover el bloque una sección o dos.
HTML HTML Bloqueo HTML y vista previa

Los botones HTML y Preview le permiten seleccionar cómo funciona el bloque HTML en el editor. El botón HTML es de forma predeterminada. Esto muestra el código HTML en su formulario de código, en lugar de su ejecución. Este ejemplo muestra el código HTML de un mapa de Google. Seleccionar la vista previa muestra cómo se verá el HTML en el frente a medida que se ejecuta en el navegador. Es fácil cambiar hacia adelante y hacia atrás entre las vistas para editar el código HTML y ver cómo sería el usuario final. Esta es una excelente manera de hacer cambios y ver rápidamente los resultados. Este ejemplo muestra un mapa de Google construido como aparecería en el contenido.


Como otro ejemplo, aquí hay algunos HTML para agregar estilo a una línea de texto. Esta es la visualización HTML, donde puedo crear y editar HTML.

Aquí está el modo de vista previa que parece que se verá en el frente. Opciones de bloqueo HTML personalizadas

En el extremo derecho de la barra de herramientas hay tres puntos en una pila vertical. Estos tres puntos abren un conjunto de 10 opciones en tres divisiones que le permiten ocultar la configuración, convertirlos en bloques, copiar, insertar, insertar antes o después, moverse, agregar a bloques reutilizables, agrupar o eliminar el bloque.

Esto es lo que pueden hacer las opciones de bloqueo personalizadas HTML: ocultar más configuraciones: oculta la barra lateral derecha, expandiendo el espacio de trabajo. Convierta en bloques: convierta el contenido en los otros bloques correspondientes. El texto se convertirá en bloques de párrafos, imágenes en bloques de imágenes, etc. El código incorporado, como el código de mapa de Google que utilicé en mi ejemplo, permanecerá como un bloque HTML personalizado. Si se pueden convertir otros códigos HTML dentro del bloque, se eliminará del bloque colocado a otro bloque. Copiar: esto copie el bloque al portapapeles para que pueda pegarlo en cualquier parte del editor. Inserte hacia adelante: esto agrega un área de bloque antes del bloque HTML personalizado, para que pueda colocar otro bloque. Insertar después: esto agrega un área después del bloque donde puede colocar otro bloque. Muévete: te permite mover el bloque hacia arriba o hacia abajo con las teclas de flecha. Moverás una línea azul. Cuando llegue a la ubicación deseada, presione ENTER y el bloque se mueva instantáneamente. Agregue a los bloques reutilizables: agregue el bloque HTML personalizado a sus bloques reutilizables para que pueda usarlo nuevamente en cualquier página o publicación.
Grupo: esto agrega el bloque a un grupo para que pueda ajustar los bloques como una sola unidad.Bloque de eliminación: esto elimina el bloque.Consejos y mejores prácticas para el uso efectivo del bloque HTML personalizado Use este bloque para estilizar su texto y editar HTML primero, luego use la herramienta de conversión para crear párrafos u otros tipos de contenido.Esto le brinda más control sobre el contenido y es especialmente útil si no necesita mantener la versión HTML.Puede ver la vista previa a medida que avanza.Esto evita que cambie entre editores visuales y de código en la configuración de WordPress en la barra lateral.
Use este bloque para mapas, comerciales, videos, etc. de construcción. Esto le impide ver el editor de código y agregar el código a otros tipos de bloques, como el bloque de párrafo. El uso de este bloque en lugar de la versión del editor de código de páginas y publicaciones. Esto crea un entorno de trabajo más limpio y más fácil de usar. Ya sea que agregue su propio código HTML o incorpore el código de otra fuente, a menudo usa la función de vista previa para asegurarse de que HTML realice cómo pretende. No use la etiqueta de script en el bloque. Se puede eliminar y luego su código no funcionaría. Con frecuencia preguntas sobre el bloque HTML personalizado ¿Qué hace que el bloque HTML personalizado? Le permite ingresar HTML en un campo para que pueda trabajar con él manteniendo la página o publicando en el editor visual. ¿Cómo se puede utilizar el bloque HTML personalizado? Se puede agregar cualquier HTML con etiquetas aceptadas. Puede usar el bloque para anuncios, mapas, videos, cualquier cosa con iframe, tablas, etc. También es una manera fácil de marcar el texto y luego convertirlo en un bloque de párrafo. ¿Se codificará el color de la marca? No, la marca de bloque se parece a cualquier editor de texto. ¿El bloque HTML personalizado ejecuta HTML? HTML funciona normalmente en el front-end. En el editor, puede ejecutar el código HTML o mostrarle el código. Depende de usted que vea y puede seleccionar entre las dos opciones en cualquier momento con un solo botón de clic. ¿Se aceptan todas las etiquetas HTML?