Claude Designin vienti: WordPress-teema html2wp-sovelluksessa
Tämä opas näyttää, miten Claude Designilla tehdystä designista tulee WordPress-sivusto html2wp-sovelluksessa ilman päätettä. Sovellus toimii Macilla ja Windowsissa. Ensin tallennat designin HTML:nä. Sitten lisäät sen sovellukseen, valitset Flashin tai Fullin, ja lopuksi lataat WordPress-teeman, joka näyttää designiltasi.
Mitä tarvitset Claude Designin muuntamiseen WordPressiksi sovelluksessa
- Mac, jossa on Apple silicon (M1 tai uudempi), ja macOS 12 tai uudempi.
- ChatGPT-tili. Muunnoksen tekee oman tilauksesi tekoäly, joten et maksa meille krediiteistä.
- Claude Designista viety design: HTML-tiedostoksi tallennettuna. Jos sivuja on useita, tallenna kukin omaksi tiedostokseen.
Clauden HTML on lyhin reitti teemaan, koska sovelluksen ei tarvitse ensin rakentaa sitä tai avata sitä selaimessa. Ilmaisversio muuntaa kolme sivustoa, kukin enintään viisi sivua. Asiakastöihin tarvitset Pro-lisenssin hintasivulta.
Asennus, ympäristö ja kirjautuminen
Lataa sovellus Macille ja siirrä se Ohjelmat-kansioon. Napsauta asetuksissa Prepare environment, niin sovellus lataa Dockerin ja muunnosympäristön. Kirjaudu sitten painikkeella Connect with ChatGPT. Sovelluksen Lovable-opas käy jokaisen näistä vaiheista läpi tarkemmin kuvakaappauksineen, ja Claudelle ne ovat samat.
Design Claude Designista sovellukseen
Lataa artifakti Claude Designissa .html-tiedostona. Luo kansio ja tallenna tiedosto siihen nimellä index.html. Jos design linkittää kuviin, jotka eivät ole tiedoston sisällä, laita ne samaan kansioon niihin paikkoihin, joita koodi odottaa. Muut sivut, kuten Tietoa tai Yhteystiedot, tulevat viereen nimillä about.html ja contact.html. Sovellus päättelee tiedostonimestä, mikä sivu on mikä.
Napsauta sovelluksessa New project (⌘N), pidä tulosteena HTML WordPress theme ja valitse Choose a folder. Jos olet pakannut kansion ZIP-tiedostoksi, käytä sen sijaan Import a ZIP -toimintoa.
Flash vai Full: Claude Designista WordPress-teema
Flash on oletus: jokainen vaihe ajetaan kerran, ja se kestää noin puoli tuntia. Full ajaa jokaisen tarkistuksen ja yrittää korjata virheet, joten se kestää noin tunnin. Yhden sivun design on yleensä lyhyemmässä päässä, mutta tarkistukset ajetaan silti kokonaan.
Muunnoksen aikana Overview-välilehti näyttää, mitä sovellus tekee. Keskeytä napsauttamalla Stop conversion ja jatka myöhemmin painikkeella Continue.
Designin tarkistus sovelluksessa
Compare-välilehti näyttää alkuperäisen ja WordPress-version rinnakkain työpöytä- ja mobiilileveydellä. Käy jokainen sivu läpi, koska automaattiset tarkistukset löytävät useimmat erot, mutta eivät kaikkia. Jos jokin ei täsmää, kirjoita se chattiin. Muutos tapahtuu esikatselussa, ja sitten Make release paketoi teemasta uuden version.
Teeman vienti: Claude Design valmiina WordPressiin
Napsauta Exports-välilehdellä WordPress-teeman vieressä Save ja tallenna ZIP. WordPressissä lataat sen kohdassa Ulkoasu → Teemat → Lisää uusi teema → Lataa teema. Teema toimii itsenäisesti: sivut, lomakkeet, valikot ja SEO toimivat ilman lisäosaa.
Visual Edit -editori tuo asiakkaallesi muokkauksen napsauttamalla. Jos työskentelet päätteessä, Claude Coden ja Codexin lisäosaa käyttävä opas kattaa saman muunnoksen.