Cómo crear fácilmente Markdown con TextSoap

TextSoap es una utilidad invaluable que encuentro cada vez más útil. Viene con limpiadores de texto especiales - pequeñas rutinas para procesar texto.

En este tutorial, presentaré TextSoap y crearé un limpiador de texto personalizado para procesar un artículo escrito en Markdown para que esté listo para agregarlo a WordPress.


El caso de uso

Cuando estoy escribiendo me gusta ver las palabras. Cuando escribe para la web, a menudo necesita algún tipo de marca para darle estilo al texto. Afortunadamente, hay Markdown para marcar el texto, pero no ocultar el texto.

Muchos sistemas de administración de contenido, o CMS, como WordPress, no aceptan el descuento directamente. Por lo tanto, hay una gran cantidad de tareas de traducción, adición y otras necesarias para que el texto esté listo para su publicación. Eso puede ser un desastre que consume mucho tiempo. Especialmente si tienes que hacerlo a menudo..

Mientras trabajaba en algunos artículos, para Tuts +, decidí automatizar el proceso de conversión de texto. Ese es el poder de TextSoap que realmente brilla..


Empezando

Cuando inicie TextSoap, se le presentará la pantalla principal.

Contiene el área de trabajo a la izquierda y la lista de limpiadores de texto a la derecha. Si ya tienes cosas en tu portapapeles, se colocarán automáticamente en el área de trabajo.


Ventana principal de TextSoap

presione el Edit Cleaners para abrir el editor de limpiador personalizado. Esta es el área de trabajo para crear un limpiador personalizado. Mostrará los contenidos del último limpiador editado. Como puedes ver, tengo muchos limpiadores personalizados..


TextSoap Edit Custom Cleaner Window

Presionando el + botón en la parte inferior izquierda creará un nuevo limpiador. Nombralo Markdown al artículo. El siguiente paso es crear el limpiador. El área del medio es la lista de clarificadores que se aplicarán. Actualmente está vacío, pero no por mucho tiempo. El lado derecho tiene todas las acciones disponibles que puede agregar al limpiador.


Creando un nuevo limpiador

Puede agregar una acción arrastrando una de la lista de la derecha al lugar que desee en el medio. Cada acción colocada en el área central se aplicará de una en una, comenzando desde la parte superior de la pantalla hasta la parte inferior. Por lo tanto, cada vez que procesa un bloque en el limpiador, en realidad pasa por todo el texto..

El área amarilla debajo del área de trabajo central es para agregar comentarios. Cuando agrega un limpiador al área central, puede agregar una descripción más legible de lo que está haciendo con ese limpiador. Esto facilita seguir el limpiador y editarlo en el futuro.!

Dado que cada bloque pasa por cada línea de texto que se va a procesar, cuantos más bloques use en su limpiador, más tiempo tomará el proceso de limpieza. Por lo tanto, es mejor mantener el número de bloques al mínimo requerido.


Añadiendo Reducción Limpiador

Lo primero que hay que hacer es convertir el texto de rebaja a HTML. Mira la lista de productos de limpieza en el lado derecho. Justo encima de la lista hay un cuadro de búsqueda. Tipo marca y un limpiador aparecerá Texto de rebaja. Arrastre ese en el área media. Eso lo hace para convertir de Markdown a HTML..

Ese limpiador, desafortunadamente, no produce el formato exacto de HTML que se necesita. Eso es lo que hará el resto de la limpiadora..


Eliminar etiquetas de párrafo HTML

Como WordPress no quiere que pongas etiquetas de párrafos, deben eliminarse. Arrastrar el Regex busca y reemplaza texto Limpiador al medio justo después de la Texto de rebaja bloquear. En el primer cuadro de texto, coloca lo que se está buscando: \<[/]*p\>. Esta es una expresión regular para detectar una etiqueta de párrafo de apertura o de cierre. El segundo cuadro de texto es qué reemplazar la cadena correspondiente. Solo déjalo en blanco para borrar las etiquetas..

Propina: Si no está seguro con las expresiones regulares, lea No sabes nada acerca de las expresiones regulares: una guía completa.

Cada Regex buscar y reemplazar Bloque debe configurarse para ignorar el caso. Por lo tanto, haga clic en el Opciones botón y cheque ignorar caso. Verá una yo colocado justo después del botón.


Agregando clases a las figuras

A continuación, todas las etiquetas de figuras deben tener la tutorial-imagen clase asociada a ella. Entonces, consigue otro Regex busca y reemplaza texto y colóquelo debajo del último. En el primer cuadro de texto, coloque \ . En el segundo bloque de texto, coloque

. No te olvides de la configuración de caso ignorar!


Corrigiendo etiquetas H2: Añadiendo
etiqueta antes

El estándar de escritura para Tuts + es tener un


etiqueta antes de cada encabezado. Para ello, hay que añadir otro. Regex busca y reemplaza texto bloque con el cuadro de texto de búsqueda que contiene ( y el cuadro de texto de reemplazo que contiene
$ 1
. Esto simplemente buscará cada

etiqueta delante de ella.


Corrigiendo etiquetas H2: Eliminando IDs

El convertidor de rebajas siempre pondrá una etiqueta de identificación en la etiqueta del encabezado. Pero, la norma dice que no hay ID! Ellos tienen que ir. Una vez más, consigue un Regex busca y reemplaza texto bloque con ] *> en el campo de búsqueda de texto y

en el campo de texto reemplazar. Esto buscará cada

etiquete sin importar lo que esté en el medio y reemplácelo con un simple

etiqueta.


Dirección de origen de la imagen de fijación

Cuando carga imágenes en WordPress, siempre las coloca en una ubicación de directorio específica, un año de cuatro dígitos y un mes de dos dígitos antes del nombre del archivo real. Como siempre se encuentra en una ubicación predecible, se puede usar una búsqueda y reemplazo para configurar esto. Antes de realizar la limpieza de texto, asegúrese de configurar el año y el mes de manera adecuada para cuando cargó las imágenes del artículo..

Esta vez, coloca un Buscar y reemplazar texto en la sección central con el primer campo de texto que contiene . Básicamente, esto encuentra una etiqueta de imagen y reemplaza todo antes del nombre del archivo con la ruta web correcta al archivo.

Hay un problema con esta implementación: el mes y el año deben cambiarse cada vez que el mes y / o el año cambian para sus artículos. Como TextSoap no tiene un sistema de memoria dinámica, debe cambiarse manualmente cada vez.


La fijación de Misc. Etiquetas de anclaje

Cuando tenga una etiqueta de anclaje para descargar algo cargado desde el área de medios de WordPress, también deberá corregir esas direcciones. Por lo tanto, simplemente repita el anterior Buscar y reemplazar texto bloque con la primera área de texto que contiene \ y la segunda área de texto que contiene .


Títulos

Lo último que necesita arreglarse son los títulos. Tuts + requiere que todos los títulos estén en mayúsculas. Pero, no todos los casos de títulos son iguales. Hay una pequeña aplicación web para crear los títulos de encabezados diseñados específicamente para los artículos de Tuts +. El examen del código JavaScript revela que se desea que las siguientes palabras estén siempre en minúsculas: a, an, y, como, at, pero, por, en, para, if, in, of, on, or, the, to, vs, vs. y via. Excepto cuando cualquiera de estos es la primera palabra en un título, entonces debe estar en mayúsculas.


Arreglando el Título del Caso: Expresión Regular

Seleccione un Si el texto coincide Bloquea y arrastra hacia el centro como arriba. En el cuadro de texto, coloque esta cadena de expresión regular \\> (.) \<\/h2\>. Esto coincidirá con cada conjunto de etiquetas y pasarlo al siguiente bloque. Hará esto para cada línea que coincida. Selecciona el Grupo de captura de partidos: a $ 1. Eso enviará solo el texto dentro de las etiquetas a los limpiadores dentro del bloque y volverá a colocar los resultados entre las etiquetas de encabezado. ¡Eso es mucho trabajo facilitado! Recuerda configurar las opciones para ignorar mayúsculas y minúsculas..

A continuación, toma un Titulo de caso con opciones bloque y arrástrelo a la mitad entre el Si el texto coincide bloque y el final condicional bloquear. Dado que la lista predeterminada para hacer pequeños es la misma que la aplicación web, entonces no es necesario agregar nada. Lo mejor de todo es que es lo suficientemente inteligente como para asegurarse de que la primera palabra siempre esté en mayúscula, sin importar qué palabra sea. Si otra palabra debe estar en minúsculas, entonces se puede agregar al cuadro de texto grande debajo de Predeterminado: a, ... . Si desea configurar algunos acrónimos para que no se cambien, puede colocarlos en el segundo cuadro de texto grande debajo de Predeterminado: AT & T ... . Yo he añadido HTML CSS PHP Porque esos siempre deben estar completamente en mayúsculas..

los Tratar: vs vs. v v. Como palabras pequeñas necesita ser revisado.


Resumen

Ahora tienes un limpiador TextSoap que tomará cualquier texto de Markdown y lo convertirá a HTML que se puede pegar directamente en WordPress para su publicación. No se necesitan más ajustes. Ahora es bastante fácil trabajar solo en Markdown y pegarlo en WordPress solo para publicar.

Por ejemplo, escribí este artículo en Sublime Text usando Markdown, copié el texto al portapapeles, utilicé mi flujo de trabajo de TextSoap Alfred para ejecutar este limpiador para convertir Markdown a HTML en el portapapeles, pegué los resultados en WordPress y cargué mis fotos. Es asi de simple!

Una palabra de precaución: pega tu HTML en el Texto pestaña del editor de WordPress!

¿Has creado algún limpiador TextSoap único? Házmelo saber en los comentarios!