Plugin voor Claude Code en Codex

Installeren

De plugin staat in twee GitHub-repositories, een voor Claude Code en een voor Codex. Beide hebben dezelfde inhoud en hetzelfde versienummer. Ze verschillen alleen in hoe elke tool ze laadt. Installeer de repository die bij jouw tool hoort, want de andere zou niet laden.

Kies je tool en voer beide commando's na elkaar uit:

Het eerste commando voegt de plugincatalogus (de marketplace) van GitHub toe. Het tweede installeert daaruit html2wp. Codex heeft een eigen repository nodig, omdat het plugins vindt via het bestand .agents/plugins/marketplace.json, en dat bestand heeft de repository voor Claude Code niet.

Updates

Het updatecommando heet in elke tool anders. In Codex is het upgrade, in Claude Code update:

De geïnstalleerde versie zie je in Codex met codex plugin list. In Claude Code ga je naar /plugin → Marketplaces → html2wp.

Is de versie in Codex na een update niet veranderd, dan heeft Codex een oude kopie bewaard. Verwijder die en installeer de plugin opnieuw:

Helpt ook dat niet, dan heeft Codex misschien nog een andere, oudere kopie van een handmatige installatie. Het commando codex plugin marketplace list toont elke catalogus. Zie je daar html2wp@<other-name>, verwijder die dan met codex plugin remove html2wp@<that-name>.

Het meeste werk gebeurt in de html2wp-dienst, en die werkt zichzelf bij, dus je volgende conversie draait al op de nieuwe versie. Je hoeft alleen het deel bij te werken dat op je computer draait: de controles, de scripts en het filter voor uitgaande gegevens. Wat er in elke versie is veranderd, staat in de commitgeschiedenis op GitHub.

Vereisten

Je hoeft dit niet zelf te controleren. Start je een conversie, dan controleert de plugin eerst je computer en somt hij op wat er ontbreekt:

Node.js                ok        v22.14.0
Python                 ok        3.12.4
Playwright             MISSING   mirroring, prerendering and every screenshot
Docker                 NOT RUNNING  installed, but the daemon is not up

Pakketten die alleen in je gebruikersmap worden geïnstalleerd, zoals Playwright of de browser chromium, biedt de plugin aan voor je te installeren. Hij vraagt het vóór elk commando. Dingen die het hele systeem veranderen, zoals Docker Desktop of een nieuwere Node.js, meldt hij alleen, en dan wacht hij tot je ze zelf installeert.

Wil je de Python-pakketten met de hand installeren:

Welk model je gebruikt

Tijdens een conversie moet de AI veel beslissingen nemen. Bijvoorbeeld: welke pagina de homepage is, waarom een controle faalde, of een klant het verschil tussen twee screenshots überhaupt zou zien. De keuze van het model beïnvloedt het resultaat dus meer dan elke andere instelling.

In Claude Code doet Opus 5 het werk en wordt Fable 5 geraadpleegd bij de belangrijke beslissingen, want daar gaat een conversie het vaakst mis.

Licentiesleutel

In de gratis versie heb je geen sleutel nodig, dus sla dit deel over. Heb je een licentie, sla de sleutel dan vóór je eerste conversie op je computer op. Dat doe je maar één keer, vanuit elke willekeurige map:

Je kunt de sleutel ook meegeven in de omgevingsvariabele H2WP_KEY, die voorrang heeft op het bestand. Het bestand is veiliger, want dan komt de sleutel niet in de geschiedenis van je terminal terecht.

In het bestand komt de html2wp-licentiesleutel die je krijgt als je Pro koopt. Een sleutel voor Visual Edit Pro hoort daar niet. Die vul je in de plugin Visual Edit in op de site die je bewerkt, en hij werkt niet voor conversies.

Of een sleutel geldig is, waarvoor je hem kunt gebruiken en tot wanneer, zie je met npx html2wp-license YOUR-KEY. De sleutelcontrole op de licentiepagina legt uit wat het resultaat betekent. Wat een licentie omvat en hoe je er een koopt, staat op de pagina over licenties.

Een project omzetten

Open een terminal in de map van het project dat je wilt omzetten, en start daar je agent:

Gebruik je Claude Code, typ dan op de laatste regel claude in plaats van codex.

Geef de agent daarna één opdracht:

Dat is alles. Je draait geen npm install of npm run build en je stelt niets in. Projecten uit Bolt, v0, shadcn of een Next.js-export worden op dezelfde manier omgezet. Je kunt in Claude Code ook alleen /html2wp:html2wp typen, of Codex vragen html2wp te gebruiken. De plugin vraagt je dan wat hij moet omzetten.

De eerste minuten van een conversie

> convert this project

  Checking this machine first…
    Node.js     ok    v22.14.0
    Playwright  MISSING
  Two Python packages are missing. Shall I install them? (they go in your
  user directory, no root)

> yes

  … installed. Building the project, then prerendering it.
  7 routes found: /, /about, /pricing, /blog, /blog/launch, /contact, /faq
  Decided: /blog is the listing, /blog/launch an article, the rest are pages.
  Written to the manifest; carrying on.

In de laatste regels legde de plugin vast hoe hij de pagina's indeelde: /blog is het artikeloverzicht, /blog/launch is een artikel en de rest zijn gewone pagina's. Controleer deze beslissing aan het einde op de afgewerkte site.

Andere invoer

De opdracht convert this project zet de map om waarin je staat. Staan de bestanden ergens anders, typ dan het pad ernaartoe, bijvoorbeeld convert ./dist.

De invoer moet altijd op je schijf staan. De plugin zet geen adres van een live site om. Hij heeft de bestanden nodig waaruit de site is opgebouwd, niet wat de browser toont.

Hoe een Lovable-project wordt omgezet

Een Lovable-app is in React gebouwd. De index.html ervan bevat alleen een leeg element en een script, en de pagina komt pas in de browser tot leven. Daarom bouwt de plugin eerst het project, opent hij het in een echte browser en slaat hij elke pagina op als afgewerkte HTML. Hij legt ook inhoud vast die pas verschijnt nadat de scripts zijn gedraaid, zoals geopende accordeons of uitklapmenu's. Daarna maakt hij het thema uit die pagina's. De details staan in de handleiding voor Lovable naar WordPress.

Wat de plugin voor je beslist

Welke pagina wat is

Eén beslissing heeft het grootste effect op het resultaat: welke pagina de homepage is, welke het artikeloverzicht, welke artikelen zijn en welke producten. De plugin leidt dat af uit de paginacode, schrijft het op en gaat door zonder te vragen. Hij stopt alleen als hij niet kan beslissen. Bijvoorbeeld als de site meer pagina's heeft dan je limiet toestaat, of als twee pagina's op dezelfde lijken.

Zit hij ernaast, dan is de oplossing goedkoop. Je corrigeert de indeling en draait de conversie opnieuw. Dat is een herhaalde run, en die telt niet mee voor je conversielimiet.

Daarna loopt het grotendeels vanzelf

Flash duurt ongeveer een half uur, Full ongeveer een uur, afhankelijk van het aantal pagina's en de snelheid van je computer. Intussen bouwt de plugin de site, vergelijkt hij haar met het origineel en stuurt hij haar naar de html2wp-dienst voor de conversie. Daarna installeert hij het afgewerkte thema in een tijdelijke WordPress in Docker op je computer en test hij het daar.

De controle die je niet overslaat

Aan het einde toont de plugin je elke pagina naast het origineel in één afbeelding. Bekijk elke afbeelding en zeg wat je ziet.

Wat je krijgt

• Het thema als ZIP-bestand. Je uploadt het in WordPress onder Weergave → Thema's → Nieuw thema toevoegen → Thema uploaden. Een kapot thema bouwt de plugin helemaal niet: bijvoorbeeld als de PHP een syntaxfout had, er inhoud ontbrak, de screenshot van het thema de verkeerde grootte had, of je in de shop niets kon kopen.
• Het rapport CONVERSION-REPORT.md in dezelfde map als de ZIP. Het noemt de omgezette pagina's, de gekoppelde menu's, alles wat je bij de controle vond, elke waarschuwing uit de conversie en wat er nog te doen is.
• Een link naar Visual Edit Lite, de gratis editor om met aanwijzen en klikken te bewerken. De editor hoort niet bij het thema, en het thema werkt zonder. Visual Edit Pro is een aparte betaalde licentie.

Het thema is zelfstandig. Pagina's, blog, formulieren, menu's, SEO en redirects horen bij de code ervan en werken zonder plugins. De code is leesbare PHP, CSS en JavaScript. Ze is van jou en niet aan ons gebonden. Het thema maakt nergens verbinding mee. Hoe je het met klikken bewerkt, staat in het deel over Visual Edit in de documentatie van de app.

Wat je computer verlaat

Je computer doet het browserwerk: de pagina's bouwen, screenshots vergelijken en een tijdelijke WordPress in Docker draaien voor de laatste controles. Het thema zelf maakt de html2wp-dienst. Daarom stuurt de plugin de dienst de gebouwde site en krijgt hij het thema terug.

De controles van het thema draaien bij jou, dus de dienst ziet hun resultaten niet. Aan het einde stuurt de plugin ze daarom naar de dienst. Dat is verplicht: de dienst start de volgende conversie pas als de vorige haar resultaten heeft gestuurd.

• Wat wordt verstuurd: de namen van de controles, of ze slaagden, aantallen pagina's, het slechtste overeenkomstpercentage en de korte namen van de pagina's die faalden, zoals about of pricing.
• Wat niet wordt verstuurd: het adres of domein van de site, code, tekst, screenshots, bestandspaden, de licentiesleutel of de naam van de site. De plugin stuurt alleen vooraf vastgelegde velden, verder niets.
• Controleer het zelf: het commando send-verdicts.sh <workspace> --dry-run toont precies wat er verstuurd zou worden, maar verstuurt niets. Het is één kort script dat je kunt lezen.

De plugin stuurt geen andere gegevens, en het afgewerkte thema stuurt helemaal niets. De volledige beschrijving, ook hoe lang we de gegevens bewaren, staat op de privacypagina.

Een fout melden

Maakt de converter zelf een fout, meld die dan met dit commando:

Een mens leest elke melding. De oplossing gaat daarna in de dienst, dus ze helpt elke gebruiker.