Lisäosa Claude Codelle ja Codexille

Asennus

Lisäosa on kahdessa GitHub-repositoriossa, toinen Claude Codelle ja toinen Codexille. Kummassakin on sama sisältö ja sama versionumero. Ne eroavat vain siinä, miten kumpikin työkalu lataa ne. Asenna se, joka kuuluu työkalullesi, koska toinen ei latautuisi.

Vaihda työkaluusi ja aja molemmat komennot peräkkäin:

Ensimmäinen komento lisää lisäosaluettelon (marketplace) GitHubista. Sitten toinen asentaa html2wp:n siitä. Codex tarvitsee oman repositorionsa, koska se löytää lisäosat tiedoston .agents/plugins/marketplace.json kautta, eikä Claude Coden repositoriossa ole tätä tiedostoa.

Päivitykset

Päivityskomennolla on kummassakin työkalussa eri nimi. Codexissa se on upgrade, Claude Codessa update:

Asennetun version näet ajamalla Codexissa codex plugin list. Claude Codessa mene kohtaan /plugin → Marketplaces → html2wp.

Jos versio Codexissa ei muuttunut päivityksen jälkeen, Codexilla on tallessa vanha kopio. Poista se ja asenna lisäosa uudelleen:

Jos sekään ei auta, Codexilla voi olla myös toinen, vanhempi kopio käsin tehdystä asennuksesta. Komento codex plugin marketplace list tulostaa jokaisen luettelon. Jos näet siellä html2wp@<other-name>, poista se komennolla codex plugin remove html2wp@<that-name>.

Suurin osa työstä tapahtuu html2wp-palvelussa, ja palvelu päivittää itsensä, joten seuraava muunnoksesi ajaa jo uutta versiota. Päivitettävä on vain tietokoneellasi toimiva osa: tarkistukset, skriptit ja lähtevän datan suodatin. Kunkin version muutokset näkyvät GitHubin commit-historiassa.

Vaatimukset

Tätä ei tarvitse tarkistaa itse. Kun aloitat muunnoksen, lisäosa tarkistaa ensin tietokoneesi ja listaa, mitä puuttuu:

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

Paketit, jotka asentuvat vain käyttäjäkansioosi, kuten Playwrightin tai chromium-selaimen, lisäosa tarjoutuu asentamaan puolestasi. Se kysyy ennen jokaista komentoa. Koko järjestelmää muuttavista asioista, kuten Docker Desktopista tai uudemmasta Node.js:stä, se vain ilmoittaa ja odottaa sitten, kunnes asennat ne itse.

Jos haluat asentaa Python-paketit käsin:

Mitä mallia käyttää

Muunnoksen aikana tekoälyn on tehtävä paljon päätöksiä. Esimerkiksi: mikä sivu on etusivu, miksi tarkistus epäonnistui tai huomaisiko asiakas edes eroa kahden kuvakaappauksen välillä. Siksi mallin valinta vaikuttaa tulokseen enemmän kuin mikään muu asetus.

Claude Codessa Opus 5 tekee työn, ja Fable 5:ltä kysytään tärkeissä päätöksissä, joissa muunnos useimmiten menee pieleen.

Lisenssiavain

Ilmaisversiossa et tarvitse avainta, joten ohita tämä osio. Jos sinulla on lisenssi, tallenna avain tietokoneellesi ennen ensimmäistä muunnosta. Teet tämän vain kerran, mistä tahansa kansiosta:

Voit antaa avaimen myös ympäristömuuttujassa H2WP_KEY, joka menee tiedoston edelle. Tiedosto on turvallisempi, koska silloin avain ei päädy päätteesi historiaan.

Tiedostoon kuuluu html2wp-lisenssiavain, jonka saat ostaessasi Pron. Visual Edit Pron avain ei kuulu sinne. Se syötetään Visual Edit -lisäosaan sivustolla, jota muokkaat, eikä se toimi muunnoksissa.

Saat selville, onko avain voimassa, mihin voit käyttää sitä ja mihin asti, ajamalla npx html2wp-license YOUR-KEY. Lisenssisivun avaintarkistus selittää, mitä tulos tarkoittaa. Mitä lisenssi sisältää ja miten sen ostaa, kerrotaan lisenssisivulla.

Projektin muuntaminen

Avaa pääte sen projektin kansiossa, jonka haluat muuntaa, ja käynnistä agenttisi siellä:

Jos käytät Claude Codea, kirjoita viimeiselle riville claude eikä codex.

Anna sitten agentille yksi komento:

Siinä kaikki. Et aja npm install- tai npm run build-komentoa etkä määritä mitään. Boltin, v0:n, shadcnin tai Next.js-exportin projektit muuntuvat samalla tavalla. Voit myös kirjoittaa Claude Codessa pelkän /html2wp:html2wp tai pyytää Codexia käyttämään html2wp:tä. Lisäosa kysyy silloin, mitä muunnetaan.

Muunnoksen ensimmäiset minuutit

> 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.

Viimeisillä riveillä lisäosa kirjasi, miten se lajitteli sivut: /blog on artikkelilistaus, /blog/launch on artikkeli ja loput ovat tavallisia sivuja. Tarkista tämä päätös lopuksi valmiilta sivustolta.

Muu syöte

Komento convert this project muuntaa kansion, jossa olet. Jos tiedostot ovat muualla, kirjoita polku niihin, esimerkiksi convert ./dist.

Syötteen on aina oltava levylläsi. Lisäosa ei muunna toiminnassa olevan sivuston osoitetta. Se tarvitsee tiedostot, joista sivusto rakennetaan, ei sitä, mitä selain näyttää.

Miten Lovable-projekti muuntuu

Lovable-sovellus on rakennettu Reactilla. Sen index.html sisältää vain tyhjän elementin ja skriptin, ja sivu herää eloon vasta selaimessa. Siksi lisäosa rakentaa ensin projektin, avaa sen oikeassa selaimessa ja tallentaa jokaisen sivun valmiina HTML:nä. Se tallentaa myös sisällön, joka ilmestyy vasta skriptien ajon jälkeen, kuten avatut haitarit tai pudotusvalikot. Sitten se tekee näistä sivuista teeman. Yksityiskohdat ovat oppaassa Lovablesta WordPressiin.

Mitä se päättää puolestasi

Mikä sivu on mikä

Yksi päätös vaikuttaa tulokseen eniten: mikä sivu on etusivu, mikä artikkelilistaus, mitkä ovat artikkeleita ja mitkä tuotteita. Lisäosa päättelee tämän sivujen koodista, kirjaa sen ylös ja jatkaa kysymättä. Se pysähtyy vain, kun se ei pysty päättämään. Esimerkiksi silloin, kun sivustolla on enemmän sivuja kuin rajasi sallii, tai kun kaksi sivua näyttää samalta.

Jos se menee pieleen, korjaus on halpa. Korjaat lajittelun ja ajat muunnoksen uudelleen. Se on uudelleenajo, eikä se kuluta muunnosrajaasi.

Sitten se etenee enimmäkseen itsestään

Flash kestää noin puoli tuntia, Full noin tunnin, riippuen sivujen määrästä ja tietokoneesi nopeudesta. Sillä välin lisäosa rakentaa sivuston, vertaa sitä alkuperäiseen ja lähettää sen html2wp-palveluun muunnettavaksi. Sen jälkeen se asentaa valmiin teeman väliaikaiseen WordPressiin Dockerissa tietokoneellasi ja testaa sen siellä.

Tarkistus, jota et voi ohittaa

Lopuksi lisäosa näyttää jokaisen sivun alkuperäisen vieressä yhdessä kuvassa. Katso jokainen kuva ja kerro, mitä näet.

Mitä saat

• Teeman ZIP-tiedostona. Lataat sen WordPressiin kohdassa Ulkoasu → Teemat → Lisää uusi teema → Lataa teema. Lisäosa ei rakenna rikkinäistä teemaa lainkaan: esimerkiksi jos PHP:ssä oli syntaksivirhe, sisältöä puuttui, teeman kuvakaappaus oli väärän kokoinen tai kaupasta ei voinut ostaa mitään.
• Raportin CONVERSION-REPORT.md samassa kansiossa kuin ZIP. Siinä luetellaan muunnetut sivut, kytketyt valikot, kaikki tarkistuksessa löytämäsi, jokainen muunnoksen varoitus ja se, mitä on vielä tehtävä.
• Linkin Visual Edit Liteen, ilmaiseen editoriin napsauttamalla tehtäviä muokkauksia varten. Editori ei ole osa teemaa, ja teema toimii ilman sitä. Visual Edit Pro on erillinen maksullinen lisenssi.

Teema on itsenäinen. Sivut, blogi, lomakkeet, valikot, SEO ja uudelleenohjaukset ovat osa sen koodia ja toimivat ilman lisäosia. Koodi on luettavaa PHP:tä, CSS:ää ja JavaScriptiä. Se kuuluu sinulle eikä ole sidottu meihin. Teema ei ota yhteyttä minnekään. Miten sitä muokataan napsauttamalla, kuvataan sovelluksen dokumentaation Visual Edit -osassa.

Mitä tietokoneeltasi lähtee

Tietokoneesi tekee selaintyön: rakentaa sivut, vertaa kuvakaappauksia ja ajaa väliaikaista WordPressiä Dockerissa lopputarkistuksia varten. Itse teeman tekee html2wp-palvelu. Siksi lisäosa lähettää sille rakennetun sivuston ja saa teeman takaisin.

Teeman tarkistukset ajetaan sinun päässäsi, joten palvelu ei näe niiden tuloksia. Lopuksi lisäosa siksi lähettää ne palveluun. Tämä on pakollista: palvelu ei aloita seuraavaa muunnosta ennen kuin edellinen on lähettänyt tuloksensa.

• Mitä lähetetään: tarkistusten nimet, menivätkö ne läpi, sivumäärät, huonoin vastaavuusprosentti ja epäonnistuneiden sivujen lyhyet nimet, kuten about tai pricing.
• Mitä ei lähetetä: sivuston osoitetta tai verkkotunnusta, koodia, tekstiä, kuvakaappauksia, tiedostopolkuja, lisenssiavainta tai sivuston nimeä. Lisäosa lähettää vain ennalta määritellyt kentät, ei mitään muuta.
• Tarkista itse: komento send-verdicts.sh <workspace> --dry-run tulostaa tarkalleen sen, mitä lähetettäisiin, mutta ei lähetä mitään. Se on yksi lyhyt skripti, jonka voit lukea.

Lisäosa ei lähetä muuta dataa, eikä valmis teema lähetä mitään. Koko kuvaus, myös se, kauanko säilytämme tietoja, on tietosuojasivulla.

Virheen ilmoittaminen

Jos muunnin itse tekee virheen, ilmoita siitä tällä komennolla:

Ihminen lukee jokaisen ilmoituksen. Korjaus menee sitten palveluun, joten se auttaa jokaista käyttäjää.