Sådan har vi skrællet V2's faktabokse og konverteret dem til Drupal-sprog

I sidste uge skrev vi om, hvordan vi fik trukket faktabokse ud af Version2’s artikler.

Målet er at slippe for at skrive de samme faktabokse igen og igen.

Vi havde held til at fange boksene med en håndfuld kodelinjer. Men det var kun første del af projektet.

HTML til Markdown

Vi har udtrukket faktaboksene i HTML-format, men for at de kan bruges i vort CMS-system, som er Drupal, skal HTML-koden konverteres til Markdown - et opmærkningssprog, som kan minde om den opmærkning Wikipedia anvender, blot mere simpel. Det benyttes i mange sammenhænge, blandt andet i den editor, som Version2's CMS benytter.

Her i værktøjskassen er vi ikke meget for at gå over åen efter vand, og mon ikke, der allerede er nogen, der har løst vort problem med at konvertere HTML til Markdown med Java?

En søgning på nettet peger på HTML2Markdown. Det bygger tilfældigvis på Jsoup, som vi allerede har med i vores lille projekt.

Jeg downloader projektet fra Github, og det består bare af en enkelt klasse i selskab med nogle hjælpeklasser.

På projektets side på Github er der angivet et eksempel på anvendelsen:

String markdownText = HTML2Md.convert(html, baseURL);

hvor første parameter er den HTML, der skal konverteres, og anden parameter er basis-url’en, som benyttes til at fikse partielle url’er i HTML-klumpen.

Vi tester med denne her klump HTML:

<aside class="plugin right box"> 
 <h3>Optag og kønsfordeling på ITU 2017</h3> 
 <p><strong>Digitale medier og design</strong><br> 71 optagne: heraf 38 kvinder (54%)</p> 
 <p><strong>Softwareudvikling</strong><br> 160 optagne: heraf 35 kvinder (22%)</p> 
 <p><strong>Global Business Informatics</strong><br> 77 optagne: heraf 24 kvinder (31%)</p> 
 <p><strong>Data Science</strong><br> 70 optagne: heraf 17 kvinder (24%)</p> 
</aside>

Og det giver dette resultat som markdown:

\#\#\# Optag og kønsfordeling på ITU 2017
 
\*\*Digitale medier og design\*\*
71 optagne: heraf 38 kvinder (54%)
 
\*\*Softwareudvikling\*\*
160 optagne: heraf 35 kvinder (22%)
 
\*\*Global Business Informatics\*\*
77 optagne: heraf 24 kvinder (31%)
 
\*\*Data Science\*\*
70 optagne: heraf 17 kvinder (24%)

Det ser sådan ud, hvis jeg plastrer det ind i Version2’s CMS-system:

Sponseret indhold

V2 Briefing | GENERATIV AI: Sådan bruger du det professionelt

Kunstig Intelligens

Og det ser jo fint ud.

Komma komma streg

Sidste skridt er at gemme faktaboksene i en komma-separeret fil, som kan indlæses i vores Google Docs-system.

Egentlig er det ikke så kompliceret at skrive en komma-fil, men der er alligevel noget med at escape kommaer, linjeskift og citationstegn. Dertil kommer, at forskellige regnearksprogrammer vistnok fortolker komma-filerne på forskellig måde - det har jeg i hvert fald læst et sted. Det nemmeste er at benytte et bibliotek, og det er også mere fleksibelt, hvis det skulle komme på tale at skifte format i fremtiden.

Det er ikke svært at finde et bibliotek til den slags. For eksempel har Apache-projektet bunker af kode til at løse hverdagens små problemer med, og deres bud i denne genre hedder CSVPrinter, og kan lige det, som vi har brug - escape tegn og gemme i forskellige dialekter af komma-formatet.

Til vores brug kan det se sådan ud:

FileWriter fileWriter = new FileWriter("C:\\\\Users\\\\tan\\\\Desktop\\\\faktabokse.csv");
CSVPrinter csvPrinter = new CSVPrinter(fileWriter, CSVFormat.DEFAULT);

CSVPrinter-constructoren tager en Appendable som første argument, og det er en bestemt slags uddata-strøm. I vores tilfælde udstyrer vi den med en FileWriter, som skriver strømmen til en fil på mit skrivebord. Det andet argument til constructeren angiver formatet, og her vælger vi det, som biblioteket foreslår og satser på, at det virker - og hvis det ikke gør, så er der andre muligheder at prøve med.

Nu ser vores kode fra sidste gang sådan her ud:

Document fragment = Jsoup.parseBodyFragment(faktaboks.html());
Elements h3 = fragment.getElementsByTag("h3");
String header = "";
if (!h3.isEmpty()) {
    header = h3.get(0).html();
}
String markdown = HTML2Md.convert(faktaboks.html(), "http://version2.dk");
csvPrinter.printRecord(header, markdown);

I forhold til sidst, udtrækker vi også en H3-header fra HTML-koden, da konventionen på vores redaktion er, at der er sådan én som overskrift i en faktaboks. Ideen er at have overskriften stående i den ene kolonne i regnearket, og Markdown-koden i cellen ved siden af. Så er det nemt at have med at gøre.

Sponseret indhold

Microsoft rykker forretningssoftware op i ny liga med AI – og det sker fra Lyngby

AI

Vi skriver til komma-filen med CsvPrinter-metoden printRecord(header, markdown). Den tager et vilkårligt antal elementer som parametre, og skriver hvert element i en celle i csv-filen. Til sidst afslutter den rækken i filen.

Og så er det bare at slippe vores lille program løs på websiderne.

Når jeg åbner min færdige csv-fil i Excel, ser det helt forkert ud:

Men det er som tidligere nævnt, fordi regnearksprogrammerne har forskellig opfattelse af formatet. Vi bruger Google Docs på redaktionen, og her går det helt fint, når der importeres:

Sponseret indhold

Mange virksomheder har en farlig tilgang til NIS2

ISO 27001

Med få linjers kode fik vi udtrukket og konverteret HTML-koden til Markdown og puttet resultatet i en kommasepareret fil, som vi kan benytte i vores Google Docs-system. Forvent flere faktuelle faktabokse for fremtiden.