OG और Twitter कार्ड जनरेटर — मेटा टैग बिल्डर, ऑडिटर और प्रीव्यू
एक फ़ॉर्म से चिपकाने के लिए तैयार Open Graph और Twitter Card <meta> टैग बनाएँ, या किसी मौजूदा <head> को अनुपलब्ध टैग, शीर्षक/विवरण की लंबाई और twitter:card की वैधता के लिए जाँचने हेतु पेस्ट करें — फिर दोनों का वास्तविक रूप से पुनः स्टाइल किए गए Twitter/X, Facebook, LinkedIn और Discord लिंक-कार्ड मॉकअप में प्रीव्यू करें।
🔒 पूरी तरह से आपके ब्राउज़र में संसाधित - आपके द्वारा यहां दर्ज की गई कोई भी चीज़ कभी भी अपलोड नहीं की जाती है।
परिणाम
Open Graph और Twitter Card मेटा टैग तय करते हैं कि कोई लिंक जिस पल Slack, iMessage, किसी ट्वीट या Discord चैनल में चिपकाया जाता है, वह कैसा दिखता है — एक शीर्षक, विवरण और इमेज जो पेज के अपने <head> द्वारा चुनी जाती है, न कि प्लैटफ़ॉर्म द्वारा दृश्य मुख्य टेक्स्ट से जो भी स्क्रैप कर लिया जाए। यह टूल एक साथ बिल्डर और ऑडिटर दोनों है, कोई सामान्य टेम्पलेट भरने वाला नहीं। BUILD मोड में, एक शीर्षक, विवरण, इमेज URL, कैनॉनिकल URL, सामग्री प्रकार और Twitter कार्ड प्रकार भरें, और यह सटीक <meta property="og:..."> और <meta name="twitter:..."> टैग ब्लॉक बनाता है, जो आपके पेज के <head> में चिपकाने के लिए तैयार है, और किसी भी खाली छोड़े गए फ़ील्ड को छोड़ देता है बजाय इसके कि खोखले टैग खाली सामग्री के साथ उत्सर्जित करे।
AUDIT मोड में, अपने मौजूदा <head> मार्कअप या पूरे पेज का HTML पेस्ट करें और टूल ब्राउज़र के नेटिव DOMParser से उसे पार्स करके हर पहले से मौजूद og: और twitter: मेटा टैग निकालता है, फिर वे जाँच चलाता है जो वास्तव में मायने रखती हैं: चार सामान्य रूप से आवश्यक टैग (og:title, og:description, og:image, og:url) अगर अनुपलब्ध हों तो चिह्नित किए जाते हैं; og:title को लगभग 60-वर्ण बिंदु जहाँ कुछ प्लैटफ़ॉर्म इसे काटना शुरू करते हैं और लगभग 90-वर्ण बिंदु जहाँ अधिकतर प्लैटफ़ॉर्म करेंगे, के विरुद्ध मापा जाता है; og:description को लगभग 155-से-200-वर्ण सीमा जो अधिकतर प्लैटफ़ॉर्म इसे काटने से पहले अनुमति देते हैं, के विरुद्ध मापा जाता है; twitter:card को उन चार वास्तविक मानों के विरुद्ध जाँचा जाता है जिन्हें Twitter का कार्ड सत्यापनकर्ता स्वीकार करता है — summary, summary_large_image, app, player — और अगर कुछ और हो तो चिह्नित किया जाता है; और डुप्लिकेट टैग (एक ही प्रॉपर्टी दो बार घोषित, एक आश्चर्यजनक रूप से सामान्य कॉपी-पेस्ट बग) नाम लेकर चिह्नित किए जाते हैं।
इमेज आयामों को एक ईमानदार दृष्टिकोण मिलता है: यह टूल बिना फ़ेच किए आपकी इमेज के वास्तविक पिक्सेल आकार को सत्यापित नहीं कर सकता, और यह जानबूझकर कभी ऐसा नहीं करता, इस साइट की कोई-बाहरी-अनुरोध नीति से मेल खाते हुए। अगर आपके HTML में पहले से og:image:width और og:image:height घोषित हैं, तो उन घोषित संख्याओं को व्यापक रूप से अनुशंसित 1200×630 न्यूनतम के विरुद्ध जाँचा जाता है; अगर नहीं, तो आपको एक काल्पनिक पास या फ़ेल के बजाय एक स्पष्ट मार्गदर्शन नोट मिलता है। दोनों मोड समान चार लिंक-प्रीव्यू मॉकअप रेंडर करते हैं — Twitter/X (twitter:card मान के आधार पर अपने संक्षिप्त "summary" थंबनेल लेआउट और पूर्ण-चौड़ाई "summary_large_image" लेआउट के बीच स्विच करता हुआ), Facebook, LinkedIn और Discord — प्रत्येक वास्तव में उस प्लैटफ़ॉर्म की अपनी टाइपोग्राफ़ी और लेआउट परंपराओं से मिलान करने के लिए पुनः स्टाइल किया गया, न कि अलग लोगो वाला एक ही बॉक्स, और प्रत्येक स्पष्ट रूप से योजना उद्देश्यों के लिए एक व्याख्यात्मक सन्निकटन के रूप में लेबल किया गया है, क्योंकि वास्तविक प्लैटफ़ॉर्म समय के साथ अपने प्रीव्यू क्रोम को पुनः स्टाइल करते हैं और यह टूल कभी उन्हें फ़ेच या स्क्रैप करके जाँच नहीं करता।