Editor WYSIWYG avanzado

El editor WYSIWYG avanzado combina un diseño ligero con potentes capacidades de edición de texto enriquecido, que admiten una sintaxis específica de Markdown. Ofrece una experiencia altamente visual e intuitiva que supera a los editores tradicionales de Markdown pero mantiene más flexibilidad que los editores WYSIWYG.

CAUTELA

Los artículos cambiados del editor Markdown o WYSIWYG al editor WYSIWYG avanzado no se pueden revertir.

Explorando el editor WYSIWYG avanzado

Uso del editor WYSIWYG avanzado

Asignación de un nombre de artículo

Cuando creas un artículo, le proporcionas un nombre. En el editor WYSIWYG avanzado, el título del artículo aparece en la parte superior del área de contenido del artículo. Haga clic en el título para editarlo. Verá las siguientes opciones:

Sugerir título:

1. Eddy AI sugiere tres opciones de título para su artículo. Seleccione el título deseado y edítelo según sea necesario.

2. Haga clic en Generar más sugerencias para ver opciones de título adicionales.

3. Use los botones Me gusta () y No me gusta () para proporcionar comentarios sobre las sugerencias de Eddy AI.

URL y descripción:

1. URL: Edite la URL del artículo en este campo. De forma predeterminada, Document360 crea la URL (también conocida como slug) basada en el título del artículo en el momento de la creación. Por ejemplo, si el título del artículo es "¿Qué es Document360?", la URL se convierte en what-is-document360.

   NOTA

   Para obtener más información, lea el artículo sobre Change the URL of an article.

2. Descripción: Ingrese una breve descripción del artículo.

NOTA

Para editar metadatos de artículos como SEO settings, search visibility, tags, labels, related articles, featured image, attachments, status indicator preferenceso deprecation, haga clic en el icono Más (⋯) en la esquina superior derecha del editor y, a continuación, seleccione Más opciones de artículo.

Puede utilizar el menú Inserción rápida , el comando de barra diagonal y la sintaxis específica de Markdown para crear y editar contenido en el editor WYSIWYG avanzado.

Menú de inserción rápida

El menú Inserción rápida aparece como una opción flotante dentro de un bloque vacío. Permite a los usuarios agregar rápidamente elementos de uso común a sus artículos.

Las opciones disponibles en el menú Inserción rápida son:

• Eddy AI Writer (): Genere contenido impulsado por IA directamente en su artículo.

• Lista de viñetas (): Inserte una lista con viñetas. Utilice el menú desplegable para seleccionar predeterminado, disco, cuadrado o círculo.

• Tabla (): Agregue una tabla para estructurar los datos.

• Imagen (): Cargue e inserte una imagen.

  NOTA

  • Utilice las herramientas disponibles para formatear la imagen. Haga clic en la imagen para abrir el menú de formato flotante.

  • Puede alinear, recortar, agregar bordes, agregar sombras, agregar subtítulos y más.

    Para obtener más información, lea el artículo sobre Image formatting in the Advanced WYSIWYG editor.

• Enlace (): Agregue un hipervínculo. También puede usar el método abreviado de Ctrl + K teclado.

• Bloque de código (): Inserte un bloque de código para el contenido técnico. Haga clic en el bloque de código para acceder a la barra de herramientas contextual:

  • Menú desplegable de idioma: seleccione el idioma deseado

  • Copiar: para copiar el bloque de código

• Más: Haga clic en Más para acceder a opciones de formato adicionales mediante el menú Barra diagonal.

NOTA

• El menú Inserción rápida solo aparece cuando el bloque está vacío.

• Desaparece automáticamente cuando empiezas a escribir.

• Si borra el contenido de un bloque, vuelve a aparecer el menú Inserción rápida.

Empieza a escribir con Eddy AI, Elige una plantilla e Importa documentos

Cuando el artículo del editor WYSIWYG avanzado está vacío, puede empezar a crear el contenido mediante las siguientes opciones:

un. Empieza a escribir con Eddy AI

1. Haga clic en Comenzar a escribir con Eddy AI.

2. Seleccione una de las opciones disponibles:

   1. Escribir artículo

   2. Crear esquema de artículo

   3. Crear artículo a partir de video

   4. Crear artículo a partir de una transcripción multimedia o un archivo de texto

3. Ingrese el mensaje o tema que desee.

   La IA generará un borrador inicial basado en las opciones seleccionadas y los aportes proporcionados.

NOTA

Para obtener más información, lea el artículo sobre AI Writer.

b. Elige una plantilla

1. Haz clic en Elegir una plantilla.

   Aparecerá un panel con las plantillas disponibles.

2. Seleccione la plantilla deseada y obtenga una vista previa.

3. Haga clic en Usar esta  plantilla paraestructurar su artículo con contenido predefinido.

   El nombre del artículo y el slug se completarán automáticamente con el título de la plantilla.

NOTA

Para obtener más información, lea el artículo sobre Templates.

C. Importe documento

1. Haga clic en Importar documento.

   Aparecerá el panel Importar.

2. Cargue un .docx archivo mediante arrastrar y soltar o la opción de cargar un archivo  .

   El nombre del artículo y el slug se generarán automáticamente en función del nombre del archivo cargado.

NOTA

• Las opciones Comenzar a escribir con Eddy AI, Elegir una plantilla e Importar documentos aparecerán de manera destacada cuando el editor de artículos esté vacío.

• Una vez que comienzas a escribir manualmente, las opciones desaparecen.

• Si borra el contenido en el editor, estas opciones vuelven a aparecer para facilitar el acceso.

Comandos de barra diagonal

Escriba / en el editor, aparece una lista de opciones. También puede buscar las opciones escribiendo los nombres de los comandos. Haga clic en el comando deseado o presione la tecla Intro para seleccionar el comando.

NOTA

Asegúrese de escribir / al principio de una línea o después de un espacio. Las opciones no aparecerán si las escribe inmediatamente después de un carácter. Puede navegar por cada comando y sección en comandos de barra diagonal utilizando las teclas de flecha arriba, abajo, derecha e izquierda.

También puede acceder fácilmente a Eddy AI Writer directamente desde la parte superior del menú de barras. Además, las opciones del comando de barra diagonal se clasifican en tres secciones:

NOTA

Mesas

Al seleccionar /table en el menú de barras, aparece un submenú con una paleta de estilo de cuadrícula:

• La selección predeterminada es una 3 × 3 tabla.

• Puede insertar hasta una 10 × 10 tabla usando la paleta.

• Utilice las teclas del teclado o el ratón paramodificar la selección.

• Después de crear la tabla, puede agregar más filas y columnas usando el icono + . Para obtener más información, lea el Tables in Advanced WYSIWYG editorarchivo .

Divisores

Al seleccionar /divider en el menú de barras, aparece un submenú que muestra tres estilos de divisor:

• Sólido (predeterminado)

• Punteado

• Discontinua

Sintaxis de Markdown

El editor WYSIWYG avanzado admite una amplia gama de sintaxis de Markdown; para obtener una lista detallada, lea el artículo sobre conceptos básicos de Markdown.

Por ejemplo, si desea agregar un Encabezado 2, escriba la siguiente sintaxis: ## Markdown syntax. La sintaxis se renderizará y el Encabezado 2 se agregará instantáneamente.

NOTA

• La sintaxis de Markdown solo funcionará cuando la escriba manualmente. No se renderizará al copiar y pegar la sintaxis.

• Para ver la lista de sintaxis de Markdown no admitida, lea el artículo sobre Advanced WYSIWYG editor basics.

Barra de herramientas

Para cambiar el diseño o la apariencia del contenido, utilice las opciones de formato enriquecido del editor WYSIWYG avanzado.

Mientras edita en el editor WYSIWYG avanzado, haga clic en el icono Formato () en el lado derecho del panel del editor.

NOTA

Al seleccionar la opción Anclar (), puede anclar la barra de herramientas al lado derecho de la interfaz del editor. Cuando la barra de herramientas está anclada, el árbol de categorías permanecerá expandido a medida que navegue entre artículos, lo que facilitará el cambio entre ellos sin expandir el árbol de categorías cada vez, mientras mantiene la barra de herramientas de formato anclada en el editor.

En pantallas más pequeñas (por debajo de 1280 px), el árbol de categorías se colapsará automáticamente cuando cambie entre artículos.

1. Estilos de texto

• Deshacer (): Para revertir la última acción.

• Rehacer (): Para volver a aplicar la última acción deshecha.

• Copiar formato (): Para copiar y aplicar formato de una parte del texto a otra.

• Borrar (): Para eliminar todos los estilos del texto seleccionado.

• Mayúsculas y minúsculas (): Para cambiar las mayúsculas y minúsculas del texto.

2. Encabezados

• : Para aplicar el estilo H2 (Encabezado 2) al texto seleccionado.

• : Para aplicar el estilo H3 (Encabezado 3) al texto seleccionado.

• : Para aplicar el estilo H4 (Encabezado 4) al texto seleccionado.

• Párrafo (): Para aplicar el estilo de párrafo estándar al texto seleccionado.

3. Tipografía

• Familia de fuentes: para seleccionar el tipo de letra para el texto.

• Tamaño de fuente: para ajustar el tamaño del texto seleccionado.

NOTA

Cuando inserta el contenido en el editor WYSIWYG avanzado, el tipo de fuente se establecerá en Verdana de forma predeterminada.

• Para cambiar la configuración de fuentes en toda la base de conocimientos, vaya a Configuración () en la barra de navegación izquierda.

• En el panel de navegación izquierdo, vaya a Sitio de la base de conocimientos > Customize site.

• En el menú desplegable Fuente del sitio , seleccione la fuente deseada.

4. Paleta

• Color de fuente: para cambiar el color del texto seleccionado.

• Color de fondo: para establecer un color de fondo para el texto seleccionado.

5. Formato y listas

• Negrita (): Para poner en negrita el texto seleccionado.

• Cursiva (): Para poner en cursiva el texto seleccionado.

• Subrayado (): Para subrayar el texto seleccionado.

• Tachado (): Para aplicar un tachado al texto seleccionado.

• Inline code (): Para agregar código en línea al texto.

• Alinear a la izquierda (): para alinear el contenido del texto con el margen izquierdo.

• Centro (): Para centrar el contenido de texto.

• Alinear a la derecha (): Para alinear el contenido del texto con el margen derecho.

• Justificar (): Para distribuir el contenido del texto de manera uniforme entre los márgenes.

• Lista de viñetas (): Para agregar una lista indicada con símbolos para cada elemento.

• Lista numerada (): Para agregar una lista indicada con numeración para cada elemento.

• Lista de numeración de varios niveles (): para agregar una lista indicada con numeración de varios niveles para cada elemento.

• Lista de verificación (): para agregar una lista indicada con casillas de verificación que los usuarios pueden marcar como completa o incompleta.

6. Controles

• Aumentar sangría (): Alejar el contenido del margen.

• Disminuir sangría (): para acercar el contenido al margen.

• Subíndice (): Para bajar el texto por debajo de la línea de base.

• Superíndice (): Para elevar el texto por encima de la línea de base.

• Altura de línea (): para elegir el espaciado entre las líneas.

• Espacio entre letras (): Para cambiar el espaciado entre las letras.

• Salto de línea (): Para cambiar a la siguiente línea.

• Salto de página (): para especificar dónde terminar la página actual y comenzar la página siguiente mientras se exporta contenido como PDF.

CONSEJO PROFESIONAL

Para cambiar el nivel de la lista numerada o con viñetas, puede utilizar los controles Aumentar sangría () o Disminuir sangría () de la barra de herramientas. Alternativamente, use los métodos abreviados de teclado Tab para aumentar la sangría o Mayús+Tab para disminuir la sangría.

Buscar y reemplazar

Para utilizar la función Buscar y reemplazar en el editor WYSIWYG avanzado:

1. Haga clic en el icono Más () en la esquina superior derecha.

2. Seleccione Buscar y reemplazar en el menú.

NOTA

Para obtener más información, lea el artículo sobre Find and replace.

Inserción de plantillas de preguntas frecuentes en el editor WYSIWYG avanzado

Para insertar plantillas de preguntas frecuentes en el editor WYSIWYG avanzado:

1. Vaya a la ubicación deseada en el artículo.  

2. Escriba el comando /FAQs Barra diagonal y seleccione Preguntas frecuentes de la lista.

   Document360 agrega tres plantillas de acordeón de preguntas frecuentes a su artículo.

3. En las plantillas de preguntas frecuentes insertadas, puede realizar las siguientes opciones:

   1. Configuración (): Haga clic para personalizar las plantillas de preguntas frecuentes según sus preferencias.

   2. Expandir/contraer (): Haga clic para expandir o contraer los acordeones de preguntas frecuentes.

   3. Eliminar (): Haga clic para eliminar toda la sección de preguntas frecuentes.

   4. Agregar pregunta (): Haga clic entre las preguntas frecuentes para insertar preguntas frecuentes personalizadas adicionales.

NOTA

• Las plantillas de preguntas frecuentes son diferentes del generador de preguntas frecuentes de IA.

• Para obtener más información, lea el artículo AI FAQ generator.

Vista de código ()

• Le permite ver y editar el contenido en formato de código HTML.

• Cambiar a la Vista de código le permite agregar elementos HTML personalizados, aplicar estilos en línea o realizar ajustes precisos.

• Use Ctrl + F para realizar una búsqueda persistente en la vista Código:

  • Presione Entrar para navegar a la siguiente aparición del término de búsqueda.

  • Presione Mayús + Entrar para navegar a la ocurrencia anterior.

• En el panel Vista de código , el Más icono () está deshabilitado.

NOTA

• Debe hacer clic en el botón Guardar para guardar los cambios realizados en la vista de código.

• La lista ordenada y desordenada pierde el orden secuencial.

• Los tipos de lista anidada no se admiten en los siguientes escenarios:

  • Cuando se copia y pega el contenido.

  • En determinados escenarios de migración de contenido.

Adición de un comentario en línea en el editor WYSIWYG avanzado

1. Vaya al artículo deseado en el portal de la base de conocimientos.

2. Seleccione el texto deseado para agregar un comentario y aparecerá un menú flotante.

3. Haga clic en el icono Comentario () del menú flotante.

4. Utilice herramientas de formato básicas como negrita y listas. Además, use el símbolo @ para mencionar a los miembros de su equipo de proyecto si es necesario.

5. Una vez hecho esto, haga clic en el icono Enviar ().

NOTA

Para desactivar este modo, vaya al portal de la base de conocimientos, Documentación () en la barra de navegación izquierda.

En el panel de navegación izquierdo, vaya a Herramientas de contenido > Diseñador de flujo de trabajo. Pase el cursor sobre el estado deseado y haga clic en el icono Editar (✎) y desactive la opción Solo lectura .

Para ver todos los comentarios de un artículo:

1. Navegue hasta el artículo deseado.

2. Haga clic en el icono Comentario () situado en el lado derecho, cerca del botón de publicación.

3. Aparecerá el panel Comentarios. Utilice el menú desplegable de la parte superior para filtrar las opciones, como Todos los comentarios, Comentarios mencionados, Comentarios abiertos y Comentarios resueltos.

Aquí puedes responder a los comentarios.

NOTA

Para obtener información, lea el artículo sobre Reviewing an article using Inline comments

Uso de listas numeradas y de varios niveles en el editor WYSIWYG avanzado

En el editor WYSIWYG avanzado, puede agregar listas numeradas y listas de varios niveles para organizar su contenido de manera efectiva.

Creación de una lista numerada

Puede crear una lista numerada utilizando uno de los siguientes métodos:

Método 1:
Escriba cualquiera de las siguientes opciones seguidas de un espacio, según sus requisitos:
1., a., A., i., I., , 1)(α).a), oi)

Método 2:
Utilice el comando de barra (/):

• /numbered list – para agregar una lista numerada. Pase el cursor sobre Lista numerada en el menú de barra diagonal para ver las opciones de lista disponibles.

• /multi-level list – para añadir una lista de varios niveles. Pase el cursor sobre Lista de varios niveles en el menú de barra diagonal para ver la lista de opciones de lista de varios niveles.

Método 3:

• Seleccione el contenido deseado y presione Ctrl + Shift + O o Ctrl + Shift + 7.

• De forma predeterminada, la lista numerada comienza con 1., 2., 3., y así sucesivamente.

Estilos de lista disponibles

Formatos de lista numerados

Están disponibles los siguientes estilos de lista numerados:

Formatos de lista de varios niveles

Puede elegir entre cuatro tipos de listas de varios niveles:

Copiar formato en el editor WYSIWYG avanzado

El pintor de formato de Document360 le ayuda a copiar y aplicar rápidamente el formato de texto de una sección a otra, lo que ahorra tiempo y garantiza la coherencia en todo el contenido.

Puede acceder al pintor de formato desde las siguientes ubicaciones en el editor WYSIWYG avanzado:

• Menú de formato

• Menú de burbujas que aparece al seleccionar texto

Uso del pintor de formato

Para usar el pintor de formato:

1. En el editor WYSIWYG avanzado, seleccione el texto de origen cuyo formato desea copiar.

2. Haga clic en el icono Copiar formato () en el menú de formato o burbuja.

3. El cursor cambiará a un icono de pincel, lo que indica que el pintor de formato está activo.

4. Aplique el formato copiado mediante:

   • Hacer clic en una palabra o letra en el texto de destino (se aplica solo a la palabra completa).

   • Arrastrando el mouse para resaltar una selección.

   • Seleccionar un bloque de texto completo.

Una vez aplicado el formato o cancelado el pintor de formatos, el cursor volverá a la normalidad.

Formato que se copiará

Solo se copiará el formato de nivel de texto . Esto incluye:

• Tipo, tamaño y color de fuente

• Negrita, cursiva, subrayado, tachado

• Espaciado entre letras

• Color de fondo (resaltado)

NOTA

• Para los encabezados, la etiqueta de encabezado también se copiará, pero solo si se selecciona todo el bloque.

• El estilo copiado se basa en el primer carácter del texto de origen seleccionado.

Cancelación del pintor de formato

El Copiar formato se desactivará si:

• Haga clic en cualquier lugar fuera del editor.

• Presione Esc.

• Realice cualquier otra acción en el editor o panel.

• Haga clic en el icono activo Copiar formato en el menú Formato.

NOTA

• Presione Ctrl + Z o haga clic en el icono Deshacer () en el menú Formato para deshacer el formato aplicado.

• Pulse Alt + Shift + V o haga clic en el icono Borrar () del menú Formato para borrar el formato del texto seleccionado.

Atajos de teclado para Copiar formato

Los métodos abreviados de teclado para usar Copiar formato son:

Opciones de formato para pegar desde Microsoft Word

Al pegar contenido de Microsoft Word, puede conservar o borrar el formato, incluidos elementos como listas, tablas, sangrías y fuentes.

1. Haga clic en Pegar con formato para conservar el formato del contenido de Microsoft Word.

2. Haga clic en Pegar como texto sin formato para borrar el formato del contenido de Microsoft Word.

Solución de problemas

No se puede editar la sección del artículo debido a etiquetas HTML no compatibles

Este problema se produce cuando un artículo se convierte del editor WYSIWYG al editor WYSIWYG avanzado, lo que da lugar a etiquetas HTML no compatibles.

Pasos para resolver:

1. Para evitar esto, evite convertir artículos del editor WYSIWYG estándar al editor WYSIWYG avanzado.

2. En su lugar, importe o copie y pegue contenido directamente en el editor WYSIWYG avanzado para evitar problemas de formato.

3. Si el problema ya se ha producido, revise la vista de código del artículo y quite las etiquetas HTML no admitidas. Estas etiquetas suelen estar envueltas dentro de la <editor360-custom-block> etiqueta. Eliminar esta etiqueta restaurará la funcionalidad de edición y resolverá el problema.

.onehope {
    display: flex;
    flex-direction: row;
    width: 100%;
    font-size: smaller;
    background-color: white;
}
.onehope .onehope_left {
    flex: 1;
    margin-right: 0.5vw;
    margin-top: 25px;
    margin-left: 0.2vw;
    text-align: justify;
}
.onehope .onehope_right {
    flex: 1;
    margin-right: 0vw;
    margin-left: 1vw;
    max-width: 30%;
    text-align: justify;
} 

<div class="onehope">
    <div class="onehope_left">
        <h3>How to reset your password</h3>
        <p>If you forget your password, click <b>Forgot Password</b> on the login page. 
        Enter your registered email, and you’ll receive a password reset link.</p>
    </div>
    <div class="onehope_right">
        <h4>Tip</h4>
        <p>For better security, choose a password with at least 8 characters, 
        including numbers and special symbols.</p>
    </div>
</div>