Integrating DropInBlog into a Next.js application
DropInBlog Next.js Integration provides a simple component for embedding DropInBlog functionality into Next.js applications. The integration allows developers to quickly add a fully-featured blog system to their projects without building a custom CMS.
GitHub Repository: https://github.com/DropInBlog/next
Installation
npm install @dropinblog/nextjs
# or
yarn add @dropinblog/nextjs
# or
pnpm add @dropinblog/nextjs
Usage
- Import the component in your blog page:
import DibBlock from '@dropinblog/nextjs';
- Add the component to your blog page:
export default function BlogPage() {
return (
<div>
<DibBlock
blogUrl="/blog"
blogId="your-dropinblog-id"
/>
</div>
);
}
API Reference
DibBlock Props
Prop | Type | Required | Description |
---|---|---|---|
| | ✅ | The base URL path where your blog is mounted (e.g., |
| | ✅ | Your DropInBlog ID from your DropInBlog dashboard |
Updated on: 26/06/2025