Gutenberg: Considere agregar una forma de vincular a un archivo desde el insertador de vínculos para que alguien pueda cargar un archivo PDF y vincularlo al texto

Estuvo de acuerdo en que esta es actualmente una experiencia subóptima tal como está actualmente. Me di cuenta de esto mientras trabajaba en # 8295, pero sospecho que este tipo de cosas pueden resolverse mejor mediante bloques en línea / anidados, una vez que se convierta en algo más A Thing.

Otra posible solución podría ser permitir la búsqueda de medios, como archivos PDF, como una opción en la barra de herramientas de enlace flotante. Como referencia, aquí hay una captura de pantalla que muestra cómo se ven actualmente los resultados de búsqueda en esa barra de herramientas:

^{Visto en http://alittletestblog.com/wp-admin/post.php?post=14091&action=edit usando Firefox 61.0.1 en macOS 10.13.6.}

Creo que probablemente sería una mejor solución (que un bloque de archivos en línea, que puede no lograr lo mismo), pero requeriría algunos ajustes en la interfaz de usuario para tenerlo en cuenta. Probablemente también desee permitir las cargas directamente, en lugar de tener que cambiar a la biblioteca de medios para cargar el archivo y luego volver a Gutenberg. (¡Y a la par con el editor clásico!)

Si bien es una gran idea para permitir la búsqueda de medios, presenta una nueva interfaz de usuario para navegar por los medios, que duplica la funcionalidad que ya existe con el cargador / navegador de medios. Tampoco le permitiría cargar sin salir del editor de Gutenberg, ¿correcto?

@designsimply Eso no resuelve el problema de no poder cargar un archivo. Tener el botón _Añadir medios_ en la barra de herramientas TinyMCE existente es considerablemente más flexible. Es mucho más fácil (y más intuitivo) agregar imágenes en línea que verse obligado a insertar un bloque _Imagen en línea_. También le permite cargar y vincular fácilmente archivos como archivos PDF o DOCX, sin tener que interrumpir su experiencia de edición saliendo del editor, yendo a la biblioteca de medios, cargando el archivo y finalmente volviendo al editor nuevamente.

Solo notando que hubo una discusión adicional sobre el # 10280.

Creo que este también podría ser un caso de uso interesante para la API de formato de texto enriquecido, por lo que se maneja de manera similar a las imágenes en línea.

Entonces, la forma de hacer esto ahora es usar el bloque de archivos, o simplemente arrastrar y soltar el PDF para cargarlo. Esto da como resultado lo siguiente:

A continuación, puede hacer clic en el botón "Copiar URL" y pegar el enlace resultante sobre el texto:

Así es como se hace hoy.

Pero estoy de acuerdo en que este flujo no es ideal y se puede optimizar. Así que etiquetándolo como tal.

Voy a cerrar esto ya que hay un bloque para Archivos y puedes tomar la URL de él. En el futuro, sería bueno expandir la herramienta "Enlace" para buscar también archivos, medios, etc. para enlazar directamente.

@mtias Estoy un poco confundido. ¿Qué significa para ti cerrar este tema? ¿Significa que se está lanzando a un lanzamiento futuro? ¿O es la intención que se pierda en los archivos de números cerrados y olvidados, o que, con suerte, alguien vuelva a sacarlo a relucir en el futuro? Me pregunto cuál es la intención de cerrar este tema, ya que usted mismo está de acuerdo en que es un tema válido.

Tenga en cuenta que hablé sobre el bloqueo de archivos cuando abrí este problema. El propósito de este problema era describir los problemas de usabilidad con el flujo de carga de archivos actual, y que el Bloque de archivos no es suficiente para una experiencia fácil de usar.

Estoy de acuerdo en que cerrar este tema parece prematuro. No se ha solucionado nada y el problema aún existe.

@mtias , ¿puedes volver a abrir este problema? Todo el mundo reconoce que se trata de una solución pirata, y usted dice que sería bueno tener una solución legítima en el futuro. Este parece ser el mejor lugar para rastrear este problema para ese futuro, ya que está bien documentado aquí y no requerirá duplicar esfuerzos para documentarlo nuevamente.

Tengo que estar de acuerdo, esto necesita una mejor solución. De hecho, tuve que encontrar este hilo antes de saber cómo cargar un PDF y vincularlo.

Voy a reabrir esto y marcarlo para 5.1.

Exigir la creación de un bloque temporal solo para copiar una URL de archivo y pegarla en un enlace es un paso atrás del antiguo editor para lo que es un caso de uso muy común: simplemente vincular a un documento en línea.

Creo que si tenemos mejoras que sabemos que nos gustaría abordar en el futuro, pero simplemente no sabemos cuándo, entonces deberíamos mantenerlas abiertas y posiblemente asignar algún hito futuro indeterminado. Así es como los manejaríamos en Trac, así que creo que deberíamos continuar con eso aquí. Cerrar los problemas hace que sea muy difícil encontrarlos y sacarlos a la luz más tarde.

@mintplugins lo siento, me perdí su ping aquí antes. Me parece bien mantener esto abierto y asignar un hito futuro. Si hay otras ideas sobre cómo manejar esto, por favor compártalas.

Una búsqueda textual como las páginas y la publicación ayudaría, pero tal vez no sería suficiente, porque los nombres de archivo (sin vista previa en la mediateca) no siempre son realmente claros Y una solución futura debería tener el mismo poder que la clásica y permitir la vinculación de texto de TODOS los tipos de filtro en la mediateca (con vista previa para la selección).
Entonces necesitamos una solución de botón que lleve a la mediateca.

Veo 2 opciones:
a) Botón de la barra de herramientas (como sugiere mintplugins al principio)
b) botón adicional solo en el formulario link-enter (donde pertenece)

Este es el primer problema que me ha planteado alguien que usa Gutenberg y me tomó encontrar esta publicación para saber cómo se supone que debe hacerlo actualmente, que es una solución extremadamente subóptima.

Creo que se requieren ambas sugerencias. Debe poder buscar un elemento multimedia existente desde la opción "enlace", así como tener la opción de cargar un nuevo enlace.

Además, sería bueno poder seleccionar algún texto y luego arrastrar y soltar un archivo en la página y automáticamente cargar ese archivo a la biblioteca de medios y vincular el texto seleccionado, en lugar de insertar el bloque de archivo.

¿Sería posible tener un botón Biblioteca de medios dentro del nuevo cuadro de diálogo Vínculo, en el que si selecciona un elemento multimedia en lugar de incrustarlo, se agrega un vínculo al archivo o un vínculo a la página de adjuntos?

¿Qué tal si simplemente gasta el panel de opciones de enlace para incluir opciones para cargar nuevos medios o vincular a los medios existentes? El botón Cargar también podría aceptar caídas.

A partir de la solución @EricDu , esta podría ser otra posible solución (y más compacta).
Falta el botón de carga, pero la interfaz de usuario es más limpia y simple. De todos modos, los usuarios siempre pueden cargar archivos mientras están en modalidad multimedia.

dónde El botón de icono abrirá la ventana emergente modal de medios.

@ virgo79 , aún necesitaría el ícono "..." para activar el menú desplegable (que actualmente solo muestra la opción "Abrir en una nueva pestaña" pero, si está abierto a complementos, podría tener opciones adicionales como clase, id etc.

No estoy seguro de cuántas capas de modales están dispuestos a aceptar los usuarios. Y el método debe ser lo más similar posible a otras instancias en las que está agregando medios.

Mi preferencia sería mantener la vista predeterminada lo más mínima posible (pegar o escribir, aplicar ícono, más ícono) y colocar las opciones que se usan con menos frecuencia (destino, medios, clase, identificación, etc.) en el menú desplegable.

@ virgo79 y @EricDu No estoy seguro de que el icono "media" sea obvio para los usuarios "estándar" en cuanto a lo que significa. La mayoría de nuestros usuarios de carga de contenido diario normal, no entenderían de inmediato que el ícono de cámara / música significa que pueden cargar un PDF y vincularlo. Creo que si va a ser solo un ícono, debe ser algo más explícito sobre "cargar" o tener un botón de texto claro como sugirió Eric. La solución debe equilibrar una interfaz de usuario limpia con una interfaz de usuario clara.

@EricDu Estoy de acuerdo con tus consideraciones.
Si pudiéramos tener más que la única opción 'abrir en una nueva pestaña', todavía necesitamos el botón '...' que activará el menú desplegable.
Pero desde mi punto de vista, el selector de medios debe seguir siendo una acción de primer nivel y no debe fusionarse con opciones secundarias como target, class, id, etc.
La ventana emergente "crear enlace" es realmente compacta aquí y para vivir las cosas muy limpias, no puedo imaginar una mejor solución que usar el ícono de medios para abrir el modal de medios.

@ andrew-dixon, el ícono de los medios, ha sido la representación oficial de la biblioteca de medios durante muchos años. No creo que esto sea un problema real para los usuarios.
Pero estoy de acuerdo en que el icono actual (cámara / música) no representa un "enlace general al archivo" ni la Biblioteca de medios.

Esta es la versión actualizada de la solución propuesta anteriormente:

Un clip es el ícono de "adjunto" de uso general, que generalmente abarca tanto el verbo / acción de contenido relativo, como también el sustantivo / elemento de lo que es el contenido.

Dicho esto, creo que insertar un enlace e insertar un enlace a un archivo adjunto son operaciones sutilmente únicas con diferentes resultados finales y deben tratarse por separado como tales.

@ virgo79 , no tengo ningún problema en convertirlo en una acción principal. El hecho de que ni siquiera sea una opción ahora, parece que no era una prioridad para todos los involucrados en el desarrollo y las pruebas beta. Quiero que la opción esté allí, pero realmente no me importa qué ícono tengo que presionar para llegar allí.

@JJJ , cuando comencé el diseño, estaba tratando de descubrir cómo representar a los medios antes de recordar que ya había un ícono de medios. El ícono que se usa aquí debe ser consistente con el ícono de Medios que se usa en otras partes de WordPress.
Creo que separar esta funcionalidad de la funcionalidad de enlace sería más confuso, ya que los usuarios podrían esperar que los medios reales se inserten en la página en lugar de un enlace a dichos medios.

@ virgo79

representación oficial de la mediateca desde hace muchos años. No creo que esto sea un problema real para los usuarios.

Entiendo lo que está diciendo, pero según mi experiencia de trabajo con muchos usuarios que ingresan contenido y no tienen otro contacto con WP, no reconocerían ese ícono como la forma de vincular a un archivo como un PDF. Dice que no cree que "sería un problema real para los usuarios", pero créanme, lo es al 100%. Por ejemplo, trabajamos con muchas escuelas y, de vez en cuando, alguien en la oficina de la escuela tiene que actualizar el contenido de su sitio web y no tendría ni idea de que sería ese ícono para vincular a un archivo, créanme.

@ andrew-dixon, la discusión del ícono de los medios realmente debería ser una discusión separada. La palabra "medios" en sí misma sugiere imágenes, sonidos y videos, mientras que en la práctica se trata de "cargas".

No tengo estadísticas para respaldarme, pero apuesto a que la gran mayoría de las cargas son imágenes, seguidas de PDF y otros archivos descargables, y que los archivos de video y audio están incrustados desde sitios de transmisión sin pasar por la carpeta de cargas.

Así que estamos atrapados con un nombre e ícono que eran apropiados hace años (cuando WordPress era solo una plataforma de blogs) pero que no representan el uso actual. Cambiar el nombre ahora podría ayudar a los nuevos usuarios pero confundir a los usuarios existentes. Sin embargo, el icono podría actualizarse.

@EricDu estuvo de acuerdo en que el ícono es un tema separado, pero la idea de usar solo un ícono es con lo que estaba expresando más problema, su maqueta original era, aunque menos "limpia", mucho más clara desde el punto de vista de la usabilidad. vista.

@ andrew-dixon, no voy a discutir contigo por apoyar mi idea inicial ;-)

Para aclarar, la forma en que aparece la interfaz de usuario por primera vez sería exactamente igual a la actual (limpia y básica). Solo el menú desplegable tendría más opciones.

Siempre habrá discusiones sobre qué características deberían estar al frente y al centro (haciendo que la interfaz de usuario sea más compleja) y cuáles deberían estar ligeramente ocultas. Para esto es la discusión de retroalimentación de diseño. Yo prefiero mantenerlo en el menú desplegable porque mantiene la interfaz de usuario simple y requiere exactamente la misma cantidad de clics para agregar un enlace que un botón separado.

Otra dirección potencial: usando el tratamiento de la configuración de la barra lateral de la imagen destacada:

Este campo le permite: arrastrar y soltar algo o hacer clic para abrir la biblioteca multimedia. Desde allí, puede cargar o seleccionar un elemento existente.

Sin embargo, tengo una pregunta (para todas estas opciones): Una vez que haya seleccionado un elemento ... ¿lo mostraremos aquí?

Otro pensamiento general aquí (podría estar fuera del alcance de este cambio):

Usar el botón de puntos suspensivos aquí parece un poco inesperado. Tradicionalmente, usamos el botón de puntos suspensivos para expandir un menú ( ver la barra de herramientas de bloque y la barra de herramientas superior, por ejemplo ), no para mostrar / ocultar un panel. El otro indicador más cercano que tenemos actualmente es el engranaje para mostrar / ocultar la barra lateral, pero creo que eso también se vuelve un poco confuso.

Me pregunto si un tratamiento en esta línea tiene más sentido en este caso:

Expandir / Contraer Panel (Contraído por defecto)

Reemplazo de la elipsis con un cheurón hacia abajo

@kjellr Estas opciones son todas mejoras a los puntos suspensivos, en mi opinión, ¡bien hecho! Honestamente, me gustan ambas variaciones, especialmente me gusta que pienses en la primera opción porque, si bien ocupa más espacio, es más obvia.

Si tuviéramos que utilizar el segundo enfoque por simplicidad (considerando que esta opción no mueve la ubicación, solo el ícono), propondría que agreguemos un divisor entre el ícono enter y el menú desplegable / arriba para agregar un poco de separación visual y coherencia con otras barras de herramientas. Ejemplo:

(puede que necesites algunos ajustes de relleno, pero ya entiendes la idea 😄)

Buena llamada, @iamthomasbishop. Comp actualizado:

Me gusta. Tiene la misma funcionalidad que mi propuesta inicial pero una zona de caída más grande.

Para el botón desplegable, seguiría lo que se usa en otras partes de Gutenberg (para no reinventar la rueda). La flecha es más intuitiva que la elipsis.

Finalmente, está el problema del nombre. ¿Necesitamos mencionar la palabra "medios" para que los usuarios se den cuenta de que nos estamos vinculando con la biblioteca de medios? También hay personas que piensan que "archivos" significa documentos PDF o MS Word, y no se dan cuenta de que las fotos también son archivos. ¿Cuánto necesitamos para atender al mínimo común denominador?

Quizás solo agregar el ícono de Medios antes de "Vinculado a un archivo" sea suficiente para aclarar.

Para referencia futura en: https://core.trac.wordpress.org/ticket/43151 , debemos asegurarnos de que la zona de caída sea un botón con estilo, en lugar de un div en el que se puede hacer clic.

Parece que tenemos una fuerte dirección hacia adelante desde las últimas maquetas de @kjellr . Estoy eliminando "Necesita comentarios de diseño" y agregando "Necesita desarrollo".

~ ¡Voy a investigar esto! ~ Editar: j / k, me llevaron a otra cosa 🙂

Idealmente, deberíamos usar el mismo componente para _Featured Image_ y _Link to a file_.

Relacionado: https://github.com/WordPress/gutenberg/issues/17557