Nuevo editor de código más moderno e intuitivo

WordPress.com ha conseguido que la experiencia de escribir código en WordPress sea mucho más potente y cómoda. Tanto desarrolladores como usuarios tienen ahora acceso a modernas funciones como el resaltado de sintaxis, el autocompletado y la búsqueda y reemplazo de términos en el editor de código.

Estas mejoras del editor de código están ya disponibles y se aplican a dos aspectos de WordPress.com:

• Los editores de código de las entradas y del sitio
• El campo de CSS adicional

¡Vamos a verlo!

Personaliza el código del bloque en el editor de entradas y del sitio

¿Alguna vez te ha pasado que, al abrir el editor de código en el editor de bloques o del sitio, te has encontrado con un enorme muro de texto imposible de leer?

Seguro que has pensado que se podría introducir alguna mejora. Quizá algo que te ayudase a escribir más rápido, detectar mejor los errores o simplemente que hiciese que el código sea más fácil de leer.

Hasta ahora, no era posible hacerlo sin instalar un plugin personalizado o de terceros.

Dale la bienvenida a una experiencia nueva y mejorada ya disponible para todos:

Como puedes ver al comparar esta captura de pantalla con la anterior, el código ahora se puede leer de forma mucho más cómoda.

CSS increíble en el campo de CSS adicional

También hemos mejorado la experiencia de escribir código CSS personalizado. En los editores de entradas y del sitio se agradece tener esta mejora, pero es a la hora de escribir CSS personalizado (en el panel Estilos del editor del sitio) donde más lo vas a notar.

Antes, añadir código en el campo CSS adicional del panel Estilos era algo parecido a esto:

Ahora, igual que en el editor de entradas y del sitio, puedes ver tu código CSS en todo su esplendor, tal y como debe ser:

¿Qué funciones hay?

Los nuevos editores de código incluyen algunas de estas funciones:

• Resaltado de sintaxis: visualiza tu código por colores según el lenguaje que estés utilizando, de forma que es mucho más sencillo entender la estructura de un solo vistazo y escribir tu propio código.
• Autocompletado: escribe más rápido y evita errores con la sencilla función de autocompletado.
• Formatos inteligentes: disfruta de funciones como el numerado de líneas, las sangrías automáticas y el emparejamiento de corchetes.
• Compatibilidad con lenguajes de código: los nuevos editores detectan y resaltan tanto HTML como CSS: ¡se acabó el texto plano en tu código!

Ah, y también está la función de buscar y reemplazar. Dentro del editor de código, utiliza la combinación «Comando + F» en Mac o «Control + F» en Windows para abrir el panel de búsqueda y reemplazo en la parte inferior del editor:

En la función de búsqueda/reemplazo puedes hacer que el texto coincida con:

• Mayúscula/minúsculas (match case)
• Expresiones habituales (regexp)
• Palabra completa (by word)

También puedes reemplazar instancias individuales de los resultados (replace), o todas ellas de una vez (replace all).

¿Cuáles son las próximas novedades?

Gracias al resaltado de sintaxis, el autocompletado y otras funciones de edición de código, WordPress.com funciona como puente entre un CMS básico y una plataforma potente compatible con la edición de código. Es un paso adelante para desarrolladores, usuarios avanzados y cualquier persona que quiera experimentar con el código de vez en cuando: y todo sin salir del editor.

Pero este es solo un primer paso en el camino de mejorar la edición de código en nuestra plataforma. Así que te lanzamos una pregunta: ¿cómo te gustaría que evolucionara la edición de código para que tengas una experiencia más satisfactoria?

En nuestro caso, nos gustaría que estas nuevas funciones se aplicaran también a los bloques Código y HTML. Quizá podamos convencer al equipo de que implemente una, o las dos.

En cualquier caso, el futuro siempre es emocionante, tanto si te gusta experimentar con el código de vez en cuando como si lo haces cada día. De momento, ¡prueba los nuevos editores y cuéntanos tus impresiones!