Step 5: Post lists
The blog home page, archives and search results are one query loop with different headings. Twenty Twenty-Five draws each post as a large title, the text, and the date, with generous spacing; card-style lists look nothing like it.
Method
- Cut the
<main>element out of the native blog home page and search results captures. - Let the route supply its own
<main>. The generic layout wraps content in a narrow Tailwind container, which constrains the theme's full-width rows. PassownMain: truetorenderLayoutand emit the theme's<main class="wp-block-group has-global-padding is-layout-constrained …">yourself. - Rebuild each item with the theme's classes (
src/platforms/wp/twentytwentyfive/archive/index.ts):wp-block-post-title has-x-large-font-size→wp-block-post-content→wp-block-post-date, each item in a group with the theme'sspacing--60padding. - Match the details that differ by route: plain heading on the blog home page;
wp-block-query-titleand the theme search form on search; "Search results for: “…”"; the theme's pagination block. - Escape visitor input carefully. The search words appear in the heading and the form's
value. Decode WordPress entities first (they arrive encoded), then escape, including<and>in the attribute. Test it with a hostile query ("><script>…).
Known difference: the theme shows each post's full content in the list; the payload carries the excerpt. Matching it means adding a field to the payload (plugin and renderer together).
Check: blog home page fidelity. On Twenty Twenty-Five it went from 61.6% / 74.9% to 98.0% / 92.0%; search results from 53.9% to 70.3% on desktop. Search lacks the theme's "More posts" section, which needs extra payload data.
Published from rickey29/twenty-twenty-five at commit 2541c1d · Flx Modernize 1.0.0 · Flx Render 1.0.0