XF2.1 Font Awesome 5, Gestor de botones del editor, soporte Markdown ¡y mucho más!

Font Awesome 5

Coincidiendo en el tiempo, más o menos cuando lanzamos XenForo 2.0, se lanzó Font Awesome 5. Como ya sabrás, Font Awesome 5 trae una gran cantidad de nuevos iconos y en tres estilos diferentes: ligero, regular y sólido. Técnicamente, también hay un cuarto estilo, que ahora contiene todos los íconos de la marca.

La cantidad de cambios en FA5 significa que hemos tenido que esperar a hacer un lanzamiento más significativo para implementarlo. Aquí estamos.

En primer lugar querrás, probablemente, decidir qué estilo te gusta. Para hacerlo, se ha creado una nueva propiedad del estilo en el grupo de propiedades del estilo "Tipografía":



En fecha posterior, se hablará un poco más sobre cómo utilizar los íconos en las plantillas, ya que allí se han hecho algunos cambios. Sin embargo, puede utilizarse el código HTML provisto en el sitio web de FA5 para un ícono específico. Vale la pena señalar que los nombres de algunos íconos y conceptos han cambiado, por lo que es posible que los ya existentes en tu código no funcionen después de la actualización.


Chris D

Continúar leyendo...

Soporte Markdown

Muchos desarrolladores seguramente estarán familiarizados con Markdown y estoy seguro de que muchos de vosotros lo habéis oído. En última instancia, es un lenguaje de formato simple y fácil de escribir que permite dar formato más fácilmente al texto plano en HTML. La sintaxis en algunos lugares es ciertamente mucho más simple que el código BB, pero por muchas razones, claramente no podemos olvidarnos por completo de los código BB.

Cualquier contenido escrito en XenForo ya está en código BB. El código BB también es mucho más extensible en términos de agregar etiquetas adicionales, especialmente para los códigos BB personalizados. Agregar Markdown hubiera sido relativamente simple, ¡pero el mayor desafío ha sido hacerlo coexistir con el código BB!

Nuestra solución a esto es admitir un subconjunto (bastante importante) de la sintaxis típica de Markdown utilizando un analizador que hemos escrito nosotros mismos. Pero en lugar de convertir Markdown en HTML al cargar la página, se convierte el código de Markdown en códigos BB en el momento de guardar.



Para aprender más sobre Markdown, puede verse aquí la "hoja de trucos" en GitHub (Aunque hay que tener en cuenta que algunas cosas son claramente específicas de GitHub ).

Chris D

Mejorada la integración del editor y la sintaxis de la opción del código BB

El hecho de que se esté implementando algo de un enfoque "para niños" en el bloque de formato de texto, no significa que se haya terminado completamente con los códigos BB. Como se mencionó anteriormente, todavía tienen su lugar, entre otras cosas debido a una sintaxis mucho más flexible.

Es cierto que los códigos BB pueden restringirnos en términos de qué funcionalidad se puede admitir. Un problema que se está resolviendo en XF 2.1 se relaciona con las opciones que se otorgan a las etiquetas de los códigos BB para que la funcionalidad disponible sea más flexible. Lo que permite hacer cosas como esta:


Lo que finalmente hace esto posible es una sintaxis de opciones de código BB mucho más flexible. El código BB resultante para la publicación anterior se ve así:

Aunque en este momento solo admitimos este tipo de sintaxis de opción avanzada en los códigos BB IMG y ATTACH, es un concepto general que otros desarrolladores podrían agregar a sus propios códigos BB en el futuro.

Chris D

Gestor de botón/desplegable del editor

A lo largo de los años, hemos tenido algunas solicitudes para mover botones específicos del editor, o para administrar el contenido de los menús desplegables o incluso configurar completamente los botones del editor. Así que nuestra próxima revelación debe ocuparse de las necesidades de configuración de su editor.



El editor de XenForo en realidad admite un total de cuatro configuraciones de la barra de herramientas en el panel, que se muestran según la ventana del dispositivo. De forma predeterminada, todos ellos, aparte de la barra de herramientas "Extra pequeña" son todas iguales, pero ahora se permite configurarlas de forma independiente. Simplemente hay que hacer clic en la barra de herramientas que se desea editar:



Mover botones o agregarlos es tan simple como arrastrar y soltar y también funciona con dispositivos táctiles. En la grabación de la pantalla anterior, se puede ver como se agrega el botón "Insertar cita" en el editor y se cambiar la posición de algún otro.

Una vez guardados los cambios, estos se reflejan en la parte pública de inmediato:



Además de mover los botones, también se pueden crear y editar menús desplegables propios. Al ver que se agrega "Insertar presupuesto" a la barra de herramientas del editor principal de arriba, probablemente ya no lo necesitemos en el menú predeterminado "Insertar":



¡Incluso puede cambiarse el icono! Aquí simplemente se elimina el botón "Insertar presupuesto" de este menú desplegable. Como se ha actualizado un menú desplegable existente, se actualiza inmediatamente en la parte pública con el nuevo ícono y el botón "Insertar presupuesto" ahora eliminado. Por supuesto, pueden crearse nuevos menús desplegables y colocarlos en la barra de herramientas en consecuencia.

Chris D

Espera... "spoiler en línea"?

Supongo que la última revelación no fue del todo "libre de spoilers" ¡Supongo que lo mostraremos, incluyendo algunas noticias importantes!



Además de estar ya activado en el editor, también puede utilizarse el código BB [ISPOILER] directamente.

Chris D

¡Tablas!

A menudo se supone que cuando se tiliza un editor de texto enriquecido como Froala podemos admitir automáticamente todas sus características. Sin duda, eso facilitaría las cosas, pero desafortunadamente los editores de texto enriquecido producen HTML y, por lo tanto, tenemos que convertir cualquier código HTML a código BB en la función de guardar y volver para la representación.

Por lo tanto, existen barreras importantes para la introducción de algunas funciones, pero creemos que hay suficiente soporte para las tablas como para ofrecerlas en XF 2.1


Por supuesto, puede escribirse el código BB manualmente, lo que probablemente utiliza una sintaxis familiar, si se está familiarizado con las tablas HTML. Aquí hay un fragmento de lo anterior:

Pero, por supuesto, ¡probablemente sea más fácil utilizar simplemente el botón "Insertar tabla" recién incorporado!


También hay que dar un enorme agradecimiento a @Steffen que ayudó con algunos de los códigos para el código BB TABLE.

Chris D

Sinceramente esperamos que te guste lo que has visto hasta ahora en XF 2.1. Definitivamente todavía tenemos mucho más que mostrarte. No te preocupes y trata de mantener tus reacciones bajo control, ya que volveremos la próxima semana con mucho más

Chris D