Sådan vibecodede jeg mit WordPress-tema
Det er ingen hemmelighed at et købt tema aldrig rigtig bliver dit. Sådan havde jeg det med “Burto”-kittet, som thomas-kramer.dk kørte på. Fint nok tema. Bare ikke mit.
Så i sidste uge besluttede jeg mig for at rive det ned og bygge et nyt fra bunden — ikke ved at hyre en wordpress-udvikler, men ved at vibe code det hele sammen med Claude Code som makker. Det tog tre dage, 11.–13. juli. Ikke som én lang maraton-session — lag for lag: først hele temaet, så et plugin, så en SEO-oprydning, og til sidst et par AI-genererede visuals som pynt på kagen.
Fra Elementor-kit til pixel-for-pixel custom
Det gamle tema var bygget i Elementor. Det nye er 100% custom-kodet, pixel-for-pixel efter et mockup jeg havde lavet i Claude Design — den slags arbejde en wordpress-udvikler normalt fakturerer i timer for. Det blev til dialog i stedet for kode fra bunden: 7 custom Elementor-widgets — hero, kontaktformular, app-kort, blog-grid, CTA og et par stykker mere — bygget specifikt til dette site, ikke til et generisk tema alle andre også bruger.
Der var ingen lokal WordPress-installation involveret på noget tidspunkt. Alt blev bygget, testet og deployet direkte til det live site via en MCP-integration, zip for zip. Ingen localhost, ingen staging-server, ingen “det virker på min maskine”.
Et plugin, der arbejder for mig
Ud over selve temaet fik jeg bygget et lille selvstændigt plugin, der gør apps til deres egen indholdstype i WordPress. Når jeg lancerer en ny app, dukker den automatisk op på portfolio-siden. Ingen manuel opdatering, intet jeg skal huske. Vil du se, hvordan en af de apps kom hele vejen fra tanke til App Store, kan du læse om det her.
Optimeret, ikke bare bygget
Et custom tema er ikke automatisk et hurtigt tema. En god del af arbejdet gik med at stramme op, efter det stod der. Ubrugt CSS og JS blev skåret væk, billeder komprimeret og lazy-loadet, scripts ryddet op, så siden ikke slæbte på kode fra det gamle Elementor-kit. Resultatet er en god PageSpeed-score på både mobil og desktop — noget der sjældent følger gratis med et custom-bygget tema.
Til sidst: pynten
Da temaet, pluginnet og SEO-oprydningen var på plads, sluttede jeg af med det sjove: en AI-genereret baggrund til hero-sektionen og et sæt custom ikoner lavet via Higgsfield. Baggrunden fylder 6,5 KB. Ikonerne vejer tilsvarende ingenting — mindre end favicon’en på de fleste websites.
Det er ikke umiddelbart det mest spændende emne — et WordPress-tema er trods alt bare et tema. Men der er noget ved at vibe code det hele, fra widget til PageSpeed-score til favicon-let baggrund, uden at åbne en eneste lokal server, der føles som en anden måde at arbejde på. Ikke hurtigere for hurtighedens skyld. Bare mere direkte.
Og så loader sitet endda hurtigere end det gjorde før. 🙂
Spørgsmål jeg selv sad med undervejs
Kan man vibe code et helt WordPress-tema uden en wordpress-udvikler?
Ja. Jeg gjorde det selv: 7 custom Elementor-widgets, et selvstændigt plugin og en SEO-oprydning, bygget over tre dage med Claude Code — uden en eneste linje skrevet af en ekstern udvikler.
Kræver det en lokal WordPress-installation?
Nej, og det overraskede mig faktisk. Alt gik direkte til det live site via MCP, zip for zip — ingen localhost, ingen staging-server.
Er det hurtigere end at hyre en wordpress-udvikler?
Ikke nødvendigvis i timer, men mere direkte: du går fra idé til live ændring uden mellemled, opgavehåndtering eller ventetid på et tilbud.