Open Graph Generator kya hai?

Open Graph Generator ek tool hai jo aapke title, description, URL, image, type aur site name se Open Graph aur Twitter Card meta tags ka ek ready-to-paste HTML block banata hai.

Meta tags banane ke liye Open Graph Generator kaise use karein?

Apna page title, description, canonical URL, og:image, type aur site name bharein, live preview update hote dekhein, phir Copy ya Download click karein aur tags ko apne page ke mein paste karein.

Open Graph aur Twitter Card tags mein kya fark hai?

Open Graph (og:) tags Facebook, LinkedIn, Slack aur kayi aur platforms padhte hain, jabki twitter: tags X/Twitter ke liye specific hote hain. Yeh tool dono deta hai taaki previews har jagah kaam karein.

Kaunsa og:image size sabse acchha kaam karta hai?

Ek absolute URL ke saath 1200x630 pixel image zyadatar platforms par summary_large_image cards ke liye safe choice hai.

Link share karne par mere changes kyun nahi dikhte?

Social platforms previews cache karte hain, isliye meta tags update karne ke baad apna URL unke sharing debugger mein paste karein taaki ek fresh scrape force ho.

Kya Open Graph Generator mein mera input private rehta hai?

Haan. Tags aapke browser mein locally build hote hain, aapka data kabhi aapke device se bahar nahi jaata, aur aap jo enter karte hain woh kuch bhi server par upload nahi hota.

Open Graph Generator

Open Graph generator jo OG aur Twitter Card meta tags ko live social-card preview ke saath banata hai.

Aapki field values aapke browser mein locally meta tags mein badal jaati hain, aur aap jo enter karte hain woh kuch bhi server par upload nahi hota.

Banaya aur maintain kiya: Udit Agarwal

Kisi link ke parts inspect karne hain? URL Parser try karein.

Open Graph Generator ke baare mein

Yeh open graph generator wo Open Graph aur Twitter Card meta tags banata hai jo aapke pages ko social platforms par rich link previews render karne ke liye chahiye. Title, description, canonical URL, og:image, type, site name aur Twitter card style bharein, phir type karte waqt ek live social-card preview update hote dekhein aur finished HTML copy karein. Yeh developers, marketers aur content teams ke liye kaafi kaam ka hai jo har property hand-write kiye bina sahi social meta tags chahte hain. Ek og meta tags generator aur twitter card generator ke roop mein yeh common og:image tags aur social meta tags cover karta hai taaki Facebook, LinkedIn, Slack aur X par share kiye gaye links polished dikhein. Sab kuch aapke browser mein locally chalta hai, isliye aapka input aapke device par process hota hai aur kuch bhi server par upload nahi hota.

Features

Open Graph (og:title, og:description, og:type, og:url, og:image, og:site_name) tags generate karta hai
Matching Twitter Card tags (twitter:card, title, description, image) jodta hai
Live social-card preview jo type karte waqt update hota hai
Ek clean, copy-ready HTML meta block deta hai
Titles, descriptions aur URLs mein special characters ko theek se escape karta hai
Aapko og:type aur twitter:card style (jaise summary_large_image) chunne deta hai
Clipboard par copy karein ya tags ko meta-tags.html ke roop mein download karein
Empty fields skip karta hai taaki generated markup tidy rahe

Open Graph Generator kaise use karein

Input fields mein apna page title, description, URL aur image URL enter karein.
og:type aur Twitter card style set karein, phir apna site name add karein.
Link kaise dikhega yeh confirm karne ke liye live social-card preview check karein.
HTML grab karne ke liye Copy click karein ya meta-tags.html save karne ke liye Download use karein.
Generated tags ko apne page ke <head> section mein paste karein.

Example

Input

title: Launch Day
url: https://acme.dev/launch
image: https://acme.dev/og.png

Output

<title>Launch Day</title>
<!-- Open Graph -->
<meta property="og:title" content="Launch Day" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://acme.dev/launch" />
<meta property="og:image" content="https://acme.dev/og.png" />
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Launch Day" />
<meta name="twitter:image" content="https://acme.dev/og.png" />

Empty fields omit ho jaate hain, aur og:type default mein website hota hai.

Common errors aur troubleshooting

og:image Facebook ya LinkedIn ke previews mein nahi dikhta. — Image ke liye ek full absolute URL (https://...) use karein, relative path nahi, aur ensure karein ki image publicly reachable hai.
Twitter large card ke bajaye ek chhoti image dikhata hai. — twitter:card value ko summary_large_image set karein taaki platforms full-width image layout render karein.
Preview mein title ya description cut off lagta hai. — Titles ko around 60 characters aur descriptions ko around 110-160 characters rakhein taaki platforms unhe truncate na karein.
& ya < jaise special characters markup todh dete hain. — Raw characters type karein; generator unhe output mein apne aap valid HTML entities mein escape kar deta hai.
Tags update karne ke baad bhi platforms purana preview data dikhate hain. — Platform ke debugger (jaise Facebook Sharing Debugger) se URL ko re-scrape karein taaki cached preview clear ho jaaye.

Aksar pooche jaane wale sawaal

Open Graph Generator kya hai?: Open Graph Generator ek tool hai jo aapke title, description, URL, image, type aur site name se Open Graph aur Twitter Card meta tags ka ek ready-to-paste HTML block banata hai.
Meta tags banane ke liye Open Graph Generator kaise use karein?: Apna page title, description, canonical URL, og:image, type aur site name bharein, live preview update hote dekhein, phir Copy ya Download click karein aur tags ko apne page ke <head> mein paste karein.
Open Graph aur Twitter Card tags mein kya fark hai?: Open Graph (og:) tags Facebook, LinkedIn, Slack aur kayi aur platforms padhte hain, jabki twitter: tags X/Twitter ke liye specific hote hain. Yeh tool dono deta hai taaki previews har jagah kaam karein.
Kaunsa og:image size sabse acchha kaam karta hai?: Ek absolute URL ke saath 1200x630 pixel image zyadatar platforms par summary_large_image cards ke liye safe choice hai.
Link share karne par mere changes kyun nahi dikhte?: Social platforms previews cache karte hain, isliye meta tags update karne ke baad apna URL unke sharing debugger mein paste karein taaki ek fresh scrape force ho.
Kya Open Graph Generator mein mera input private rehta hai?: Haan. Tags aapke browser mein locally build hote hain, aapka data kabhi aapke device se bahar nahi jaata, aur aap jo enter karte hain woh kuch bhi server par upload nahi hota.

Related tools

HTML Formatter — HTML beautify ya minify karein, inline CSS/JS format karein aur result preview karein.
URL Parser — Ek URL ko uske parts mein todein aur query parameters list karein.
URL Encode / Decode — URL components ko encode aur decode karein.
HTML Escape / Unescape — HTML special characters aur entities ko escape aur unescape karein.
QR Code Generator — Text ya URL se ek QR code generate karein; PNG ya SVG ke roop mein download karein.
Markdown Preview — Markdown ko live preview ke saath HTML mein render karein.
Image Format Converter — Images ko PNG, JPEG aur WebP ke beech poori tarah aapke browser mein convert karein.

Web aur DevOps ke aur tools

robots.txt Generator — User-agent rules aur sitemaps ke saath robots.txt banayein.
XML Sitemap Generator — URLs ki list ko ek valid sitemap.xml mein badlein.
.htaccess Generator — Apache rules — HTTPS, redirects, gzip, caching — banayein.
Nginx Config Generator — Simple toggles se ek complete nginx server block banayein.
Semver Calculator — Semantic versions ko parse, compare, range-check, increment aur coerce karein.
Cache-Control Header Generator — Simple toggles aur human time units se ek correct HTTP Cache-Control response header banayein.
Meta Tag Generator — SEO, Open Graph aur Twitter Card meta tags ek form se banayein
CSP Generator — Content-Security-Policy header directive by directive banayein
htpasswd Generator — bcrypt ya SHA-1 ke saath ek .htpasswd user line generate karein
Tailwind Color Generator — Ek brand color ko OKLCH mein poore 50-950 Tailwind shade scale mein badlein, contrast ke saath.
CSS Grid Generator — Ek grid visually design karein — columns, rows, gaps, merged cells — phir saaf grid-template CSS copy karein.
CSS Clamp Calculator — Min/max size aur do viewport widths se ek fluid CSS clamp() value banayein, live preview ke saath.

Web aur DevOps ke sabhi tools dekhein (27) · Saare tools