Hoe u moeiteloos Markdown kunt maken met TextSoap

TextSoap is een waardevol hulpprogramma dat ik steeds nuttiger vind. Het wordt geleverd met speciale tekstreinigers - kleine routines voor het verwerken van tekst.

In deze tutorial zal ik TextSoap introduceren en een aangepaste tekstschoonmaker maken voor het verwerken van een artikel dat is geschreven in Markdown om het klaar te maken voor toevoeging aan WordPress.


De use case

Als ik schrijf, zie ik graag de woorden. Wanneer u schrijft voor internet, hebt u vaak een bepaald type markup nodig om uw tekst op te maken. Gelukkig is er Markdown om de tekst op te maken, maar niet om de tekst te verbergen.

Veel inhoudbeheersystemen of CMS, zoals WordPress accepteren geen korting rechtstreeks. Daarom zijn er veel vertaal-, toevoegings- en andere taken vereist om de tekst gereed te maken voor publicatie. Dat kan een tijdrovende puinhoop zijn. Vooral als je het vaak moet doen.

Terwijl ik aan Tuts + werkte, besloot ik het tekstconversieproces te automatiseren. Dat is waar de kracht van TextSoap echt uitstraalt.


Ermee beginnen

Wanneer u TextSoap start, krijgt u het hoofdscherm te zien.

Het bevat het werkgebied aan de linkerkant en de lijst met tekstschoonmaakprogramma's aan de rechterkant. Als je al spullen op je klembord hebt staan, wordt deze automatisch in het werkgebied geplaatst.


Het hoofdvenster van TextSoap

druk de Edit Cleaners om de editor voor aangepast opschonen te openen. Dit is het werkgebied om een ​​aangepaste reiniger te maken. Het toont de inhoud van de laatste bewerkte reiniger. Zoals je kunt zien, heb ik veel aangepaste reinigingsmiddelen.


TextSoap Edit Custom Cleaner Window

Druk op de + knop linksonder maakt een nieuwe cleaner. Noem maar op Afwaardering naar artikel. De volgende stap is om de cleaner te maken. Het middelste gebied is de lijst met clearners die moeten worden toegepast. Het is momenteel leeg, maar niet voor lang. De rechterkant bevat alle beschikbare acties die u aan de robot kunt toevoegen.


Een nieuwe reiniger maken

U kunt acties toevoegen door er een te slepen in de lijst aan de rechterkant tot waar u deze in het midden wilt hebben. Elke actie in het middelste gedeelte wordt een voor een toegepast vanaf de bovenkant van het scherm tot onderaan. Daarom gaat het elke keer dat het een blok in de robot verwerkt, door de hele tekst.

Het gele gebied onder het middelste werkgebied is voor het toevoegen van opmerkingen. Wanneer u een schonere toevoegt aan het middelste gebied, kunt u een beter leesbare beschrijving toevoegen van wat u aan het doen bent met die reiniger. Dit maakt het eenvoudiger om de robot te volgen en in de toekomst te bewerken!

Omdat elk blok door elke regel tekst gaat die moet worden verwerkt, geldt hoe meer blokken u gebruikt in uw robot, hoe langer het reinigingsproces duurt. Daarom is het het beste om het aantal blokken tot het minimum te beperken.


Het toevoegen Markdown schoonmaakster

Het eerste wat u moet doen, is de markdown-tekst naar HTML converteren. Kijk naar de lijst met reinigingsmiddelen aan de rechterkant. Recht boven de lijst is een zoekvak. Type Mark en er verschijnt een schoonmaakmiddel Tekst markeren. Sleep die naar het middelste gedeelte. Dat doet het voor het converteren van Markdown naar HTML.

Die schonere produceert helaas niet het exacte formaat HTML dat nodig is. Dat is wat de rest van de robot zal doen.


HTML-alinea-tags verwijderen

Omdat WordPress niet wil dat u alinea-tags invoert, moeten deze worden verwijderd. Sleept de Regex Zoek en vervang tekst schoner naar het midden net na de Tekst markeren blok. Plaats in het eerste tekstvak wat wordt doorzocht: \<[/]*p\>. Dit is een reguliere expressie voor het detecteren van een openende of sluitende alineatags. Het tweede tekstvak is wat de overeenkomende tekenreeks moet vervangen. Laat het gewoon leeg om de tags te verwijderen.

Tip: Als je niet zeker bent van reguliere expressies, lees dan U weet niets over reguliere expressies: een complete gids.

elk Regex zoeken en vervangen blok moet worden ingesteld om case te negeren. Klik daarom op de opties knop en controleer negeer zaak. Je zult een zien ik geplaatst vlak na de knop.


Klassen aan figuren toevoegen

Vervolgens moeten alle figuurlabels de les-image klasse die ermee verbonden is. Dus, pak een andere Regex Zoek en vervang tekst en plaats het onder de laatste. In het eerste tekstvak plaatsen \ . In het tweede tekstblok, plaats

. Vergeet de negeer case-instelling niet!


Bevestiging van H2-tags: toevoegen
tag ervoor

De schrijfstandaard voor Tuts + is om een


label voor elke header. Om dit te doen, moet je nog een toevoegen Regex Zoek en vervang tekst blokkeren met het zoekvak met de tekst ( en het vervangtekstvak met daarin
$ 1
. Dit zal eenvoudig naar elk zoeken

label ervoor.


H2-tags repareren: id's verwijderen

De markdown-converter plaatst altijd een ID-tag in de header-tag. Maar de standaard zegt geen ID's! Ze moeten gaan. Wederom een ​​krijgen Regex Zoek en vervang tekst blokkeren met ] *> in het tekstveld Zoeken en

in het tekstveld Vervangen. Dit zal naar elk zoeken

label, ongeacht wat er in het midden zit en vervang het door slechts een vlakte

label.


Beeldbronadres corrigeren

Wanneer u afbeeldingen in WordPress uploadt, worden deze altijd op een specifieke maplocatie, een viercijferig jaar en een tweecijferige maand vóór de naam van het daadwerkelijke bestand geplaatst. Omdat het altijd op een voorspelbare locatie is, kan een zoekopdracht en vervanging worden gebruikt om dit in te stellen. Voordat u de tekst opschoont, moet u het jaar en de maand correct instellen voor wanneer u de afbeeldingen voor het artikel hebt geüpload.

Plaats deze keer een Zoek en vervang tekst in het middelste gedeelte met het eerste tekstveld met . Dit vindt in principe een afbeeldingstag en vervangt alles vóór de bestandsnaam met het juiste webpad naar het bestand.

Er is één probleem met deze implementatie: de maand en het jaar moeten worden gewijzigd elke keer dat de maand en / of het jaar verandert voor uw artikelen. Aangezien TextSoap geen dynamisch geheugensysteem heeft, moet het elke keer handmatig worden gewijzigd.


Bevestigen van Misc. Anker Tags

Wanneer u een ankertag hebt om iets te downloaden dat is geladen vanuit het mediagebied van WordPress, moet u ook die adressen corrigeren. Herhaal daarom gewoon de vorige Zoek en vervang tekst blokkeren met het eerste tekstgebied met \ en het tweede tekstgebied dat bevat .


titels

Het laatste ding dat moet worden opgelost, zijn de titels. Voor Tuts + moeten alle titels een titel hebben. Maar niet alle titels zijn hetzelfde. Er is een kleine webapp voor het maken van de headers-titelcase die speciaal is ontworpen voor Tuts + -artikelen. Als je de JavaScript-code onderzoekt, is het gewenst dat de volgende woorden altijd kleine letters zijn: a, an en, als, op, maar, door, en, voor, als, in, van, op, of, de, naar, vs, versus, en via. Uitgezonderd wanneer een van deze het eerste woord in een titel is, moet het worden gekapitaliseerd.


Titel case repareren: reguliere expressie

Selecteer een Als tekst overeenkomt blokkeren en naar het midden slepen zoals hierboven. Plaats deze reguliere expressie in het tekstvak \\> (.) \<\/h2\>. Dit komt overeen met elke tag ingesteld en geef het door aan het volgende blok. Het zal dit doen voor elke regel die overeenkomt. Stel de Match vastleggingsgroep: naar $ 1. Hierdoor wordt alleen de tekst in de tags naar de schonere (n) binnen in het blok verzonden en worden de resultaten weer tussen de headertags geplaatst. Dat is heel gemakkelijk werken! Vergeet niet om de opties om het geval te negeren in te stellen.

Pak vervolgens een Titelcase met opties blok en sleep het naar het midden tussen de Als tekst overeenkomt blok en de voorwaardelijk beëindigen blok. Omdat de standaardlijst voor klein maken hetzelfde is als de web-app, hoeft er niets te worden toegevoegd. Het beste van alles is dat het slim genoeg is om ervoor te zorgen dat het eerste woord altijd met een hoofdletter wordt geschreven, ongeacht welk woord het is. Als een ander woord een kleine letter moet zijn, kan dit worden toegevoegd aan het grote tekstvak onder Standaard: a, ... . Als u wilt instellen dat sommige afkortingen niet worden gewijzigd, kunt u ze in het tweede grote tekstvak onder plaatsen Standaard: AT & T ... . Ik heb toegevoegd HTML CSS PHP omdat die altijd volledig in hoofdletters moeten zijn.

De Traktatie: vs vs. v v. Als kleine woorden Moet nagekeken worden.


Samenvatting

Nu heb je een TextSoap-opschoonprogramma dat elke Markdown-tekst inneemt en converteert naar HTML die direct in WordPress kan worden geplakt voor publicatie. Geen aanpassingen meer nodig. Het is nu eenvoudig genoeg om alleen in Markdown te werken en het in WordPress te plakken, gewoon om te publiceren.

Ik schreef dit artikel bijvoorbeeld in Sublime Text met Markdown, kopieerde de tekst naar het klembord, gebruikte mijn TextSoap Alfred-workflow om deze cleaner uit te voeren om de Markdown naar HTML in het klembord te converteren, plakte de resultaten in WordPress en uploadde mijn foto's. Zo simpel is het!

Een woord van waarschuwing: plak je HTML in de Tekst tabblad van de WordPress-editor!

Hebt u unieke TextSoap-schoonmakers gemaakt? Laat het me weten in de comments!