¿Cómo usar el editor de texto Pixpa?

de pixpa Editor WYSIWYG (Lo que ves es lo que obtienes) proporciona una Interfaz potente e intuitiva para agregar y formatear contenido en Páginas, blogs y otras secciones de su sitio web. Con la última actualización, el editor se ha mejorado significativamente, ofreciendo nuevos elementos de contenido, herramientas de escritura impulsadas por IA, opciones de diseño mejoradas y controles de formato interactivos.

Esta guía le guiará a través de interfaz del editor, cómo utilizar sus funciones y cómo optimizar el contenido de su sitio web.

En este artículo hablaremos de:

Cuando trabaje con el editor de texto Pixpa, presione ENTER (ventanas) o RETURN (mac) para crear un nuevo párrafo, para insertar una nueva línea sin forzar un nuevo párrafo, mantenga presionada la tecla SHIFT y luego presione enter o return.

La mayoría de las funciones del editor surtirán efecto en el momento en que haga clic en el botón/icono. En otros casos, al hacer clic en el icono aparecerá un pequeño menú desplegable con opciones adicionales.

Al agregar estilo a su texto, puede hacer clic en la opción de editor y comenzar a escribir para obtener el resultado seleccionado o escribir su texto, resaltarlo y luego hacer clic en la opción de editor para agregarlo al texto seleccionado.


Agregar elementos usando el botón “+”

Una de las mayores mejoras del nuevo editor es la Botón "+", que abre un menú con una variedad de elementos de contenido que se pueden insertar en el área de texto.

Elementos disponibles bajo el botón “+”:

  • Herramientas de IA: Utilice la asistencia de escritura impulsada por IA para generar ideas de contenido, reescribir texto o crear contenido rápidamente. Más información.
  • Texto: Añadir texto de párrafo estándar.
  • Encabezado: Insertar diferentes niveles de encabezado (H1, H2, H3, etc.) para una mejor jerarquía del contenido.
  • Imagen: Sube e inserta imágenes directamente en el texto.
    • Puedes cargar imágenes o insertarlas ingresando una URL.
  • Lista de quehaceres: Crear listas de verificación con casillas de verificación interactivas.
  • Lista: Agregar la extensión de viñetas or listas numeradas para contenido estructurado.
  • Embed: Insertar contenido externo como Vídeos, mapas, archivos de audio y iframes.
  • Mesa: Agregue tablas para la representación de datos estructurados. En la opción de tabla, encontrará las siguientes opciones adicionales.
    • Añadir cabeza – Inserta una fila de encabezado en la parte superior de la tabla, que puede usarse para títulos de columnas.
    • Agregar columna antes – Agrega una nueva columna a la izquierda de la columna seleccionada.
    • Agregar columna después – Agrega una nueva columna a la derecha de la columna seleccionada.
    • Agregar fila a continuación – Insertar una nueva fila debajo de la fila seleccionada.
    • Añadir fila arriba – Insertar una nueva fila encima de la fila seleccionada.
    • Quitar la cabeza – Elimina la fila de encabezado de la tabla.
    • Quitar columna – Elimina la columna seleccionada.
    • Eliminar fila – Elimina la fila seleccionada.
    • Eliminar tabla – Elimina la tabla completa del editor.
  • Citar: Resaltar texto como cotización en bloque Para enfatizar. Esto crea un bloque de texto distintivo con una línea vertical a la izquierda, que lo separa visualmente del resto del contenido para resaltar el texto citado.
  • Fragmento de código: Insertar y formatear HTML, CSS, JavaScript u otros lenguajes de programación dentro del contenido.
  • Línea: Agregue un divisor horizontal para separar secciones de contenido.
  • Diseño: Usando el Diseño Con esta opción, puede organizar el contenido en bloques horizontales en varias secciones. Esto permite una estructuración flexible y una mejor jerarquía visual en su página web. A continuación, se muestran las características principales:

    • Diseños de columnas múltiples:Elija entre una, dos, tres o cuatro columnas para organizar el contenido de diferentes maneras.
    • Relaciones de división personalizadas:Seleccione relaciones predefinidas como 60/40 o 40/60 para controlar el ancho de cada sección.
    • Bloques anidados:Puede seleccionar un bloque y crear varios bloques separados dentro de él para una mejor organización.
  • Envoltura: Agrupe varios elementos para una mejor organización.
  • Insertar tabla de contenidos: Crea una tabla de contenido basada en los encabezados del documento, lo que facilita la navegación. Es útil para blogs, tutoriales y artículos extensos, ya que permite a los lectores acceder rápidamente a las secciones.

Esta enfoque modular hace que sea fácil personalizar el diseño y añadir diferentes elementos de contenido de manera eficiente.


Herramientas de IA

La función Herramientas de IA del Editor de texto Pixpa te permite mejorar tu contenido con ayuda de IA. Estas son las opciones disponibles:

  • Expresar de otro modo – Modifique el texto seleccionado manteniendo intacto el significado original. Esto ayuda a mejorar la legibilidad o a reformular oraciones para que sean más claras.
  • Acortar – Condensar el texto seleccionado para hacerlo más conciso pero conservando la información clave.
  • Alargar – Ampliar el texto seleccionado agregando detalles relevantes para hacerlo más descriptivo e informativo.
  • Simplificar – Reescribir el texto utilizando un lenguaje más sencillo, haciéndolo más fácil de entender pero conservando la intención original.
  • Gramática correcta – Verifique y corrija automáticamente errores gramaticales en el texto seleccionado, mejorando su precisión y legibilidad.
  • Traducir – Traduce el texto seleccionado a un idioma diferente, lo que te permitirá crear contenido multilingüe sin esfuerzo.

Estas funciones impulsadas por IA ayudan a agilizar la creación de contenido, haciéndola más rápida y eficiente.


Formato: cambia el estilo de fuente

Puedes usar diferentes tipos de estilos de fuente en su sitio web (a la vez) que se especificarían en el Sección de diseño. Este es un estilo de diseño común que se usa en todo el sitio web.

Todos los estilos de fuente se especifican en el sección de diseño. También puede hacer clic en Administrar fuentes, que es la última opción en el menú desplegable al hacer clic en el Texto Botón. Ahora puede ver y configurar las siguientes fuentes y editar el estilo, el tamaño, el color, el grosor, la altura de línea y el espaciado entre letras:

  • Rumbo 1
  • Rumbo 2
  • Rumbo 3
  • Rumbo 4
  • Texto de párrafo (pequeño y grande)
  • Título 1 Extra Grande

Aquí hay una captura de pantalla del estilo Título 1. Aquí también puede editar las otras fuentes de párrafo de encabezados.

Una vez que especifique el estilo de fuente en la sección de diseño, puede usarlos de manera eficiente en todo el sitio web. Simplemente seleccione el texto y aplique el formato. El sistema aplicará automáticamente el color, el tamaño y el peso de las fuentes de ese estilo en particular al texto seleccionado. Puede revisar lo mismo en el sitio web.

Nota:

El estilo, el peso y el color de la fuente serán visibles solo en el sitio web, NO en el estudio.


Negrita/cursiva

  • Negrita – El texto resaltado se pondrá en negrita cuando se haga clic en él. En HTML, esto usa una etiqueta.
  • Cursiva – El texto resaltado se pondrá en cursiva cuando se haga clic en él. En HTML, esto usa la


Línea – Agregar una línea

El Editor le permite agregar una línea horizontal. Al hacer clic en este ícono, se agregará una línea en el lugar donde se coloca el cursor.


Más opciones de formato

El menú Más formatos del editor de texto Pixpa ofrece opciones de estilo de texto adicionales para mejorar la apariencia y la estructura del contenido. Esto es lo que hace cada opción:

  • Código – Formatea el texto seleccionado como código en línea o fragmento de código. Esto resulta útil para mostrar contenido técnico o de programación.
  • Subrayado – Agrega un subrayado al texto seleccionado para enfatizarlo.
  • Comercial Añade un ancla con nombre al texto seleccionado, lo que permite crear enlaces internos que dirigen directamente a esa sección específica en la misma página. Útil para crear tablas de contenido o navegación dentro de la página.
  • sobrescrito – Muestra el texto seleccionado ligeramente por encima de la línea base del texto normal (p. ej., X²). Se utiliza habitualmente para expresiones matemáticas y notas al pie.
  • subíndice – Muestra el texto seleccionado ligeramente por debajo de la línea base del texto normal (por ejemplo, H₂O). Resulta útil para fórmulas químicas y otras notaciones especiales.
  • Destacar – Resalta el texto seleccionado con un color de fondo para llamar la atención sobre el contenido importante.
  • Suprimido – Tacha el texto seleccionado para indicar eliminación o corrección.
  • Borrar todos los estilos – Elimina todo el formato aplicado al texto seleccionado y lo restaura al estilo predeterminado.


Alineación

Puede alinear su texto a la izquierda, a la derecha, al centro y justificado. Seleccione el texto y elija la alineación del menú desplegable.


Color de Texto

Por defecto, el sistema aplicará el color de fuente especificado en el sección de diseño. Sin embargo, puede anular el color global con esta herramienta. Seleccione el texto y haga clic en el icono de color, aparecerá una paleta estándar de colores para que elija.

Aparte de esto, también puedes especificar un color de fondo para el texto seleccionado desde aquí.

Nota: Puede especificar cualquier otro color personalizado que no esté disponible en la paleta de colores de Establecer color opción ingresando la Código hexadecimal del color


Lista

Puede convertir fácilmente su texto en listas con sangrías para organizarlas.

  • Lista de viñetas – El texto resaltado se formateará como una lista con viñetas. En HTML, esto utiliza un conjunto de y etiquetas
  • Lista numerada – El texto resaltado se formateará como una lista numerada. En HTML, esto utiliza un conjunto de y etiquetas


El Editor le permite insertar un enlace a cualquier texto. Puede conectar las páginas de su sitio web existente o cualquier otro sitio web/blog/PDF, etc.

Al resaltar el texto y hacer clic en este botón, se abrirá una pequeña ventana modal donde puede ingresar la URL de destino, elegir si abrir o no en una nueva ventana o elegir vincular a otra página en su propio sitio. En HTML, la etiqueta utilizada es Link Text

Atención

  • Para vincular a un sitio web externo que está fuera de su sitio Pixpa, ingrese http://seguido de la dirección web, por ejemplo http://www.example.com.
  • Para vincular a una galería o categoría de tienda o página dentro de su sitio, ingrese el slug de URL, por ejemplo /gallery
  • Para crear un vínculo que abra un cliente de escritorio de correo electrónico, ingrese mailto: seguido de la dirección de correo electrónico, por ejemplo mailto:example@example.com.
  • Para crear un enlace que haga una llamada telefónica, ingrese tel:, seguido del número de teléfono con código de país, por ejemplo tel:+0-123-456-7890
  • Para crear un enlace que abra Whatsapp, ingrese https://wa.me/<number> donde el <number> es un número de teléfono completo en formato internacional. Omita los ceros, corchetes o guiones al agregar el número de teléfono en formato internacional. Por ejemplo: Usar https://wa.me/15551234567   https://wa.me/+001-(555)1234567Conozca más.
  • Para vincular a su PDF u otro archivo cargado en la sección de archivos, ingrese el enlace copiado aquí. Conozca más.
  • Haga clic aquí para obtener más información sobre Pixpa Link Builder.


Imagen – Agregar una imagen

Puedes agregar imágenes a tu contenido fácilmente usando la opción Agregar imagen en el editor de texto Pixpa. Ya sea que quieras cargar imágenes desde tu dispositivo o insertarlas a través de una URL, esta función te brinda una manera sencilla de mejorar tus publicaciones con elementos visuales.

  • Insertar imagen mediante URL – Puedes pegar la URL de una imagen y hacer clic en el botón Insertar para agregarla directamente a la página.
  • Subir imagen desde el dispositivo – Puede arrastrar y soltar una imagen en el cuadro de carga designado o hacer clic dentro del cuadro para seleccionar una imagen de su dispositivo.


Emoji

La opción Emoji del editor de texto Pixpa te permite mejorar tu contenido con una variedad de emojis. Los emojis se pueden usar para hacer que tu contenido sea más expresivo, agregar énfasis o transmitir emociones de una manera divertida y creativa.


Tabla

La opción Tabla le permite insertar tablas directamente en el editor de texto. Una vez agregadas, puede personalizar la estructura y el contenido de la tabla mediante múltiples opciones de formato.

Opciones de edición de tabla:

  • Agregar cabeza – Agrega una fila de encabezado en la parte superior de la tabla para resaltar los títulos de las columnas.
  • Agregar columna antes – Inserta una nueva columna a la izquierda de la columna seleccionada.
  • Agregar columna después – Inserta una nueva columna a la derecha de la columna seleccionada.
  • Agregar fila a continuación – Inserta una nueva fila debajo de la fila seleccionada.
  • Agregar fila arriba – Inserta una nueva fila encima de la fila seleccionada.
  • quitar la cabeza – Elimina el encabezado de la tabla si se agrega uno.
  • Quitar columna – Elimina la columna seleccionada de la tabla.
  • Quitar fila – Elimina la fila seleccionada de la tabla.
  • Eliminar tabla – Elimina completamente la tabla del editor.


Insertar tabla de contenidos

Crea una tabla de contenido basada en los encabezados del documento, lo que facilita la navegación. Es útil para blogs, tutoriales y artículos extensos, ya que permite a los lectores acceder rápidamente a las secciones.


Comercial

El Herramienta de anclaje Permite añadir un ID HTML único a una sección o párrafo de tu entrada. Esto es útil para crear enlaces internos (enlaces de salto), lo que permite a los visitantes hacer clic en un enlace y acceder directamente a una sección específica de la página.

Cómo usarlo:

  1. Haga clic en cualquier lugar del párrafo o sección que desee anclar.
  2. Desde la barra de herramientas, haga clic en el icono Icono de ancla.
  3. Aparecerá una ventana emergente titulada "Ancla".
  4. En la pantalla “Agregar o cambiar ID” En este campo, introduzca un ID único (por ejemplo, paragraph-2).
  5. Haga clic en Guardar.

Notas importantes:

  • La identificación debe ser minúsculas, Contiene No hay espacios, y use guiones si es necesario.
  • Una vez configurado, puedes vincularlo a este ancla usando #your-id al final de tu URL.
    • Ejemplo: https://yourwebsite.com/page#paragraph-2

Esta función es ideal para publicaciones largas o artículos con una tabla de contenido, permitiendo a los lectores navegar rápidamente a secciones específicas.


Ver código HTML

La ventana del editor puede funcionar como un editor visual (WYSIWYG) o como un editor de HTML.

Sin embargo, puede cambiar al editor HTML haciendo clic en él. Puede cambiar cualquier cosa desde la vista de código si sabe cómo hacerlo o también puede hacer ping al equipo de soporte de Pixpa si necesita ayuda.

Consejo: Con la ayuda de la vista de código HTML, puede agregar cualquier tipo de código incrustado en su publicación de blog.  


Opciones específicas de la sección

Cada sección que se añade al editor de texto incluye opciones de personalización adicionales que permiten modificar su aspecto y funcionalidad. Puedes acceder a estas opciones haciendo clic en las dos líneas horizontales que se encuentran junto a la sección, lo que abre un menú desplegable con varios controles.

  • Agregar la extensión de – Inserte un nuevo bloque de contenido debajo del actual para agregar rápidamente más texto, imágenes u otros elementos.
  • Formato – Le permite cambiar entre diferentes estilos de bloque de texto, como párrafo, encabezado o cita.

  • Comercial – Agrega un ID de anclaje al bloque para que puedas crear enlaces dentro de la página que salten directamente a esta sección.
  • Subir / Bajar – Reorganiza la posición de la sección dentro de tu contenido moviéndola hacia arriba o hacia abajo.
  • Color – Cambiar el color del texto del bloque seleccionado.
  • Color de Fondo: – Establezca un color de fondo detrás del texto en el bloque para enfatizar o contrastar.
  • Borde – Agregue o modifique bordes alrededor de la sección para estructurar su contenido de manera más efectiva.

  • Espaciado – Ajusta el relleno alrededor del bloque, incluida la parte superior, la inferior y los lados, lo que le permite controlar el espaciado y el diseño con mayor precisión.

  • Duplique – Clona la sección para mantener la coherencia en el formato y la estructura en las diferentes partes de tu contenido.
  • Eliminar – Retire la sección por completo si ya no es necesaria.

Estas configuraciones le permiten controlar completamente la estructura del contenido, garantizando un diseño bien organizado y visualmente atractivo.

Atención

Las opciones específicas de sección disponibles pueden variar según el tipo de sección agregada al editor.


Conclusión

El Editor WYSIWYG de Pixpa trae un Moderno, rico en funciones e intuitivo. Experiencia de edición de contenido. Con su versión mejorada Elementos de contenido, herramientas de IA, incrustación de medios y formato estructuradoCrear páginas y publicaciones de blog atractivas ahora es más eficiente que nunca.

Al utilizar estas funciones, puede: Mejora tu contenido, mejoran compromiso del usuarioy crea un Experiencia de sitio web perfecta.

¿No encuentras lo que buscas?

Póngase en contacto con un Experto Pixpa.