Guide
How to convert a Lovable site to WordPress: the complete guide
Lovable is excellent for getting a vibe-coded site out fast. WordPress is where most teams want to live afterwards: editors, plugins, hosting, SEO tooling. This guide covers what you have when you export from Lovable, the realistic ways to convert Lovable to WordPress, and how to judge the result. Whether you call it converting, moving or migrating a Lovable site, the work is the same: get the code out, rebuild it as WordPress blocks, then check it page by page.
What a Lovable export contains
You get the code out of Lovable in one of two ways: connect the project to GitHub, which works on every plan, or click Download codebase to save a ZIP, which needs a paid plan. The step-by-step export guide covers both.
Either way the export is a standard React + TypeScript project styled with Tailwind CSS and shadcn/ui components. Apps created before 13 May 2026 are Vite apps with pages in src/pages and routes in src/App.tsx; newer apps use TanStack Start, with file-based routes in src/routes. Around them: src/components with the shared header, footer and UI pieces, a stylesheet with the design tokens as CSS variables, and public or src/assets with the images. Content lives inside JSX: headings, paragraphs, arrays of features or products mapped into cards.
Copying the rendered HTML does not get you a WordPress site. New Lovable apps are server-rendered and older ones are prerendered for search engines, so the HTML exists, but it is a flat snapshot: pasted into WordPress it becomes one Custom HTML block that no editor wants to touch, with styles that depend on the Tailwind build. An editable site needs the structure rebuilt as blocks, which is why a conversion starts from the React source.
Four ways to get it into WordPress
- Rebuild by hand. A developer or a page-builder user recreates every section. Faithful if the person is good, expensive, and every later Lovable change means doing it again. Realistic effort: one to several days per site.
- Embed the React app (iframe or a static build served from a WordPress page). Fast, but the content is not editable in WordPress, SEO settings and analytics live in two places, and you now host two things.
- Headless WordPress as a content API behind the React app. Right for teams that want React in production; it does not give editors a WordPress site, it gives them a WordPress admin feeding a React deployment.
- Convert the source into a block theme. The React code is parsed and rewritten as native Gutenberg blocks with the same styles, images, forms and products. The output is plain WordPress with nothing running from Lovable. This is what the Lovable to WordPress converter does.
The method comparison puts these side by side with cost, editability and maintenance. Still deciding whether you need WordPress at all? Read Lovable vs WordPress.
How a converter maps React to blocks
A good conversion is a compilation problem, not a copy problem. IQDesk parses each page with the TypeScript compiler, inlines the components it imports, expands mapped arrays, resolves the Tailwind classes to concrete values (spacing, colors, type, borders, layout), and builds a page schema of sections, columns, cards, headings, text, images, buttons, lists, forms and products. That schema is then written as block markup, one pattern per page, plus header and footer parts and a theme.json with the palette and type scale. Because every block is a core block with valid attributes, the pages open in the Site Editor without "invalid block" warnings.
What converts well
- Marketing pages: hero, features, pricing, testimonials, FAQ, about, contact.
- Layout built with Tailwind grids and flex rows; cards with borders, backgrounds and pinned buttons.
- Colors and fonts defined as design tokens; hover states; viewport-height heroes.
- Images from the project, logos, aspect-ratio boxes.
- Forms (to Contact Form 7) and product listings (to WooCommerce).
- Page titles, meta descriptions and structured data declared in the routes of TanStack Start apps, which land in Yoast, Rank Math or SEOPress.
What needs work
- Interactive components (tabs, modals, sliders) convert to their default state. Some become native blocks (accordions → details, image stacks → a carousel).
- Decorations positioned absolutely (blurred blobs, floating badges) are reported and mostly dropped; they rarely matter, and the AI agent can rebuild the ones that do.
- Application features: authentication, Supabase or Lovable Cloud data, dashboards, client state. These are not website content and are not converted; the report lists them so nothing is silently lost.
- Social images (Open Graph) and, for older React + Vite apps, per-page titles and descriptions are set in your SEO plugin after the move.
The full list is on the supported features page.
How to check the result
Do not judge by a screenshot of the home page. Compare page by page, at the same width, with the same fonts loaded: the heading order and count, the number of images and forms, the section heights, and then the details (button colors, spacing, type sizes). IQDesk's review screen does this automatically against the published Lovable site in WordPress Playground and lists the differences per page; anything left can be handed to the AI fix agent, which measures both pages before and after its change.
After the move
- Install an SEO plugin; check titles and descriptions and add social images per page.
- Redirects in the project's
public/_redirectsfile become WordPress redirects; add any others if page slugs change. - Connect the Contact Form 7 form to your mail delivery; configure WooCommerce payments and shipping.
- Keep the theme: it is a normal block theme, so future changes are made in WordPress, not by re-converting.
- Choose where it lives: any WordPress host works. The Lovable hosting guide compares the options.
FAQ
How do I migrate a Lovable site to WordPress?
Three steps: export the code from Lovable, convert it into a WordPress block theme, then check the result page by page. A converter does the middle step in seconds; the alternatives are rebuilding the site by hand, embedding the React app, or running WordPress headless behind it.
Can I convert a Lovable app with a login and a database?
The public pages, yes. The app screens behind the login are not website content and will not become WordPress pages; the conversion report lists them.
Does the converted site still depend on Lovable?
No. The theme is self-contained: images are copied into it, styles are in the theme, pages are WordPress pages.
Will the pages be editable in the block editor?
Yes. Every page is made of core blocks with valid attributes. Header and footer are template parts in the Site Editor.
Is there a Lovable WordPress plugin?
No. Nothing inside WordPress turns a Lovable site into pages. The conversion happens before WordPress: IQDesk gives you a block theme that you upload and activate once.
How long does it take?
Minutes: conversion in seconds, the in-browser WordPress preview in under two minutes, a typical AI fix in two to seven minutes.