Overriding components
Replace built-in pages and wire your own Link/Image
Use pageOverrides
to replace any built-in page or loading component, and components
to wire your router-specific Link
/Image
.
import { BetterBlogContextProvider } from 'better-blog/client';
function MyHome() { return <div>Custom Home</div>; }
function MyHomeLoading() { return <div>Loading home…</div>; }
<BetterBlogContextProvider
clientConfig={clientConfig}
components={{ Link: MyLink, Image: MyImage }}
pageOverrides={{ HomeComponent: MyHome, HomeLoadingComponent: MyHomeLoading }}
>
{children}
</BetterBlogContextProvider>
Common overrides:
- Replace home, post list, tag list, post detail pages
- Swap loading/skeleton components for each route
- Inject your design system primitives via
components