Lovable Blog to WordPress: Posts and Categories

What a Lovable blog actually is

Lovable builds React and TypeScript apps styled with Tailwind CSS and shadcn/ui. There is no posts table. A blog in that app is almost always a plain data structure in the source, plus two views that read it.

Open the export and look for a file like src/data/posts.ts or an array declared at the top of a page component. Each entry tends to have a title, a slug or id, a date, an excerpt, an image path and a body. The body may be a string, markdown, or JSX written directly in the component.

Then there are two routes. A listing page maps over the array and renders cards. A detail page reads the slug from the URL and finds the matching entry. In older React and Vite apps those live in src/pages with the routes in src/App.tsx. In apps created from 13 May 2026 they are file-based routes in src/routes, each with a head() holding the title, description and JSON-LD.

• The array is your content — every post you want in WordPress is one object in it.
• The listing page is a loop — it becomes a WordPress query loop, not a hand-built page.
• The detail page is a template — it becomes single.html in the block theme.
• Categories are usually a string field — something like category: "Design" on each entry.

What WordPress needs instead

WordPress stores posts in the database and renders them through templates. So the move splits into two jobs that are easier to think about separately.

The first job is content: each array entry becomes a row in the posts table, with a post title, post content as block markup, a publish date, a featured image and a category term. The second job is presentation: a block theme with an index.html or home.html template that runs a query loop, and a single.html template for one post.

Get both and your blog behaves like any WordPress blog. You can write the next post in the editor, categories get their own archive pages, and feeds, pagination and search work without extra code.

Converting the blog automatically

Our converter reads the Lovable ZIP or your GitHub repository in the browser and outputs a WordPress block theme. When it finds blog-like data arrays it turns them into real posts and categories, and builds the listing as a query loop instead of a static copy of the cards.

That means the design of your cards carries over as block markup, while the content lives in the database where you can edit it. Headings, paragraphs, lists, quotes, images and aspect ratios all convert. The Tailwind type scale and colors go into theme.json, so posts you write later look like the ones you imported.

Per-page titles and descriptions from TanStack Start head() functions are written to Yoast, Rank Math or SEOPress if one of those is installed, and JSON-LD is carried over. Older React and Vite apps do not expose per-page meta the same way, so you will set descriptions yourself after import.

Conversion, the side-by-side review in WordPress Playground and the theme download are free, and every account includes two free AI-fix attempts. See supported features for the full list of what converts, what is approximated and what is left out.

1. Export the project: GitHub sync on any plan, or Download codebase as a ZIP on a paid plan. Details in our export guide.
2. Open iqdesk.com/app and load the ZIP or connect the repository.
3. Review the result next to the original in WordPress Playground, and check the blog listing and one post page.
4. Use an AI fix if a card or the post template needs adjusting, then download the theme.
5. In WordPress go to Appearance → Themes → Add New → Upload Theme, then Activate. Pages are created on activation and the front page is set.

Doing it by hand

If you prefer to rebuild, the content and the templates are still two separate tasks. Start with content, because it decides how much template work you need.

For a handful of posts, copy and paste is honestly fine. Create each post in the editor, paste the body, set the category, upload the image as the featured image, and set the slug to match the old URL. For dozens of posts, convert the array to a feed or an import file and use an importer plugin, or write the posts with WP-CLI from a script that reads the same array.

Then build the templates. In a block theme that means index.html with a query loop, single.html for one post, and archive.html for category pages. Edit them in Appearance → Editor. The block markup is HTML files in the theme; the design tokens live in theme.json. The block theme documentation on developer.wordpress.org covers the file structure.

• Slugs — set each post slug to the old path segment so links survive.
• Permalinks — pick the structure under Settings → Permalinks before you import, not after.
• Categories — create the terms first, then assign them during import.
• Featured images — upload the files from the Lovable public folder and attach them.

Keeping the URLs you had

A Lovable blog usually lives at something like /blog with posts at /blog/post-slug. WordPress can produce the same shape, but you have to ask for it.

Set the permalink structure under Settings → Permalinks. If you want posts under /blog/, use a structure with that prefix, and make sure no page is also using the blog slug. Then set each post slug to match the old one exactly, including hyphens.

If some URLs have to change, redirect them. Our converter reads public/_redirects from the Lovable project and carries those rules over, so redirects you already had do not get lost. For new redirects, add them at your host or with a redirect plugin. A 301 tells search engines the post moved rather than disappeared.

What will not come across

Be clear-eyed about the parts of a blog that are React behaviour rather than content. Custom React state and event handlers do not convert. A tag filter that updates the list without a page load, an infinite-scroll loader, a reading-progress bar or a live search box all need to be rebuilt as WordPress features or plugins.

Anything fetched at runtime is also out. Supabase, authentication, API calls and third-party widgets are not converted, so a comment widget or a newsletter embed has to be added again in WordPress. Iframes, canvas, Lottie and video without a static src do not come across either.

Some things are approximated rather than dropped. Carousels, tabs and dropdowns convert in their default state only, animations convert to their final state, and responsive layout uses desktop values because WordPress stacks columns on mobile. Open Graph tags and per-page meta from older React and Vite apps are not converted.

The good news is that most of these have native replacements. Category archives replace a tag filter. Pagination replaces infinite scroll. WordPress comments replace a comment widget. Our comparison of conversion approaches walks through when a rebuild is the better call.

After the import

Check the listing page first. Every post should appear, in the right order, with the right category and image. Then open two or three posts and read them end to end. Imported markdown sometimes loses a list or a code block.

Keep the site out of the index while you work. Settings → Reading has a checkbox called "Discourage search engines from indexing this site". Check it on staging and uncheck it before launch.

Confirm the front page is what you expect under Settings → Reading → "Your homepage displays". If the blog listing is your home page, point it at the posts page; if a landing page is, point it at that page and assign a separate page for posts.

Finally, write one new post in the editor. It is the fastest way to prove the template works and that your next article will look like the imported ones. Our launch checklist covers the rest of the go-live steps. For anything about Lovable itself that is not covered here, check Lovable's documentation.

FAQ

Does a Lovable blog become real WordPress posts or just static pages?

With our converter, blog-like data arrays in the Lovable project become real posts and categories, and the listing page becomes a query loop. That means you can edit and add posts in the WordPress editor afterwards. If you rebuild by hand, you decide: pasting posts into the editor or using an importer both produce real posts, while copying the cards into a page would only produce a static listing.

Where is the blog content stored in a Lovable project?

Usually in a TypeScript array in the source, such as a file in src/data or an array at the top of the blog page component. Each entry holds a title, slug, date, excerpt, image path and body. There is no database behind a standard Lovable blog, so the array is the content you need to move.

Can I keep my blog post URLs after moving to WordPress?

Yes, in most cases. Set the permalink structure under Settings to Permalinks so it matches the old path, then set each post slug to the old slug exactly. For URLs that have to change, add 301 redirects. Our converter also carries over redirect rules from the public/_redirects file in the Lovable project.

What blog features need rebuilding in WordPress?

Anything driven by React state or runtime data. Tag filters without a page load, infinite scroll, live search, comment widgets, newsletter embeds and API calls are not converted. Most have native WordPress equivalents, such as category archives, pagination and built-in comments.

Do my post titles and descriptions carry over for SEO?

For apps created from 13 May 2026, per-page titles and descriptions come from the TanStack Start head() function and are written to Yoast, Rank Math or SEOPress during conversion, along with JSON-LD. Older React and Vite apps do not expose per-page meta in the same way, so those are not converted. In that case you set titles and descriptions in your SEO plugin after import.

Keep reading