Dynamic OG

Effortlessly create unique dynamic OG images for every piece of content you share.

To our App »

About DynamicOG

Dynamic OG helps you solve image generation process for your blogs/docs wherever you think links play a vital role for your websites.

• Why waste time on manual image creation when you can focus on what truly matters - your content.
• Choose from our variety of templates that designed to fit any purpose.

New templates added weekly!

Why DynamicOG ?

Crafting Open Graph images can be a time-consuming and tedious task, especially for dynamic pages. Dynamic OG simplifies this process, saving you valuable time and effort.

Tech Stack

To learn more about the technologies used in this site , see the following resources:

• Next.js - the official Next.js documentation
• Tailwind CSS - the official Tailwind CSS documentation
• Headless UI - the official Headless UI documentation

Getting started

Prerequisites

• nodejs >= 18.17.0
• vercel (for production)

For Development

1. Install Dependencies:

npm install

2. Start the Development Server:

npm run dev

This will typically start the server on http://localhost:3000. You can open this URL in your browser to view the application as you make changes.

3. Environment Variables

Add your domain in your .env.local

NEXT_PUBLIC_DOMAIN=http://localhost:3000

4. Optional: Environment Variables

This project optionally supports integration with:

• Beam Analytics for tracking website usage and performance.

• DocsAI for implementing a chatbot to enhance user interaction.

If you wish to leverage these tools, create a file named .env.local at the root of your project directory (not tracked in version control) and add the following environment variables:

NEXT_BEAM_ANALYTICS_ID=YOUR_BEAM_ID
NEXT_DOCS_AI_ID=YOUR_DOCS_AI_ID

For Production

1. Fork this repository.
2. Go to your vercel dashboard and connect git with this repository.
3. Add environment variables.
4. Deploy it on vercel.

Learn more about deploying Nextjs with Vercel