نحوه استفاده
- og:title و og:description که در صفحه استفاده می‌کنید یا قصد استفاده از آن را دارید وارد کنید.
- URL کامل og:image را جای‌گذاری کنید. ابزار آن را بارگیری می‌کند و اندازه پیکسلی واقعی آن را گزارش می‌دهد.
- URL صفحه یا دامنه را اضافه کنید، سپس پیش‌نمایش کارت بزرگ و کوچک را مقایسه کنید و هر هشداری را برطرف کنید.
نحوه کار
وقتی کسی لینکی را به اشتراک می‌گذارد، بیشتر شبکه‌های اجتماعی و برنامه‌های چت صفحه را واکشی می‌کنند و تگ‌های Open Graph آن را می‌خوانند: og:title، og:description، og:image و og:url. سپس یک کارت می‌سازند. یک تصویر عریض با نسبت حدود ۱.۹۱:۱ معمولاً کارت بزرگ با تصویر در بالا ایجاد می‌کند؛ یک تصویر کوچک یا مربعی اغلب کارت فشرده با یک بندانگشتی کنار متن تولید می‌کند.
این ابزار دو سبک کارت عمومی را نشان می‌دهد تا به شما در بررسی طول و قاب‌بندی تصویر کمک کند. بعد از بارگذاری تصویر در مرورگر، اندازه طبیعی آن را بررسی می‌کند: زیر ۲۰۰ × ۲۰۰ پیکسل، بسیاری از برنامه‌ها تصویر را نادیده می‌گیرند، زیر ۶۰۰ × ۳۱۵ پیکسل معمولاً از طرح کوچک استفاده می‌کنند، و نسبت بسیار دور از ۱.۹۱:۱ به معنای برش خوردن است. اندازه ۱۲۰۰ × ۶۳۰ پیکسل به‌طور گسترده توصیه می‌شود زیرا در صفحه‌های با تراکم بالا واضح می‌ماند.
پیش‌نمایش نمی‌تواند دقیقاً نشان دهد که یک برنامه خاص چه چیزی را نمایش می‌دهد. برنامه‌ها در تعداد خطوط عنوان و توضیحی که نشان می‌دهند متفاوت‌اند، برخی توضیح را نادیده می‌گیرند، و اکثر آنها پیش‌نمایش را برای مدتی پس از اولین اشتراک‌گذاری کش می‌کنند، بنابراین ممکن است تغییرات تگ‌های شما فوراً ظاهر نشود. بسیاری از پلتفرم‌ها ابزار اشکال‌زدایی خود را برای تازه‌سازی آن کش ارائه می‌دهند.
نمونه‌ها
اسکرین‌شات استفاده‌شده به‌عنوان og:image
اسکرین‌شات 1440 × 900 نسبتی برابر با 1.6:1 دارد. ابزار درباره این نسبت هشدار می‌دهد: در کارت بزرگ، بالا و پایین تصویر بریده می‌شود. گرفتن خروجی نسخه 1200 × 630 از بروز مشکل جلوگیری می‌کند.
لوگو به‌عنوان تنها تصویر
لوگوی 180 × 180 کمتر از 200 × 200 پیکسل است، بنابراین بسیاری از برنامه‌ها هیچ تصویری نشان نمی‌دهند. به‌جای آن از یک بنر عریض بزرگ‌تر استفاده کنید که لوگو را نیز در خود دارد.
بررسی طول عنوان
og:title با 90 کاراکتر در پیش‌نمایش کارت بزرگ به سه خط می‌شکند. کوتاه‌کردن آن به حدود 60 کاراکتر، کارت را در بیشتر برنامه‌ها مرتب نگه می‌دارد.
پرسش‌های متداول
چرا لینک من در Facebook، LinkedIn و X متفاوت دیده می‌شود؟
هر پلتفرم کارت‌ها را با چیدمان، برش و محدودیت‌های متنی خودش نمایش می‌دهد و برخی توضیحات را نشان می‌دهند و برخی نه. این پیش‌نمایش یک تقریب کلی است، نه نسخه‌ای از طراحی هیچ پلتفرمی.
og:image را عوض کردم اما هنوز تصویر قبلی نمایش داده می‌شود. چرا؟
پلتفرم‌ها پیش‌نمایش لینک را کش می‌کنند. از دیباگر اشتراک‌گذاری خود پلتفرم استفاده کنید تا صفحه دوباره واکشی شود، یا منتظر بمانید تا کش منقضی شود. تغییر نام فایل تصویر نیز کمک می‌کند.
آیا می‌توانم از تصویر SVG یا WebP استفاده کنم؟
SVG در بیشتر پلتفرم‌ها پشتیبانی نمی‌شود. WebP در بسیاری از برنامه‌ها کار می‌کند اما نه در همه؛ JPG یا PNG امن‌ترین انتخاب است.
چرا ابزار نمی‌تواند تصویر من را بارگیری کند؟
ممکن است URL به ورود به حساب نیاز داشته باشد، به‌جای تصویر به یک صفحه HTML اشاره کند، یا سرور درخواست‌های سایت‌های دیگر را مسدود کند. اگر مرورگر نتواند آن را اینجا بارگیری کند، خزنده پلتفرم اجتماعی نیز احتمالاً نمی‌تواند.
حریم خصوصی
متنی که وارد می‌کنید در مرورگر شما باقی می‌ماند. برای بررسی تصویر، مرورگر شما آن را مستقیماً از URL واردشده درخواست می‌کند (بدون ارسال ارجاع‌دهنده)، بنابراین سرور یک درخواست تصویر عادی می‌بیند. هیچ چیزی به TIG Tools ارسال نمی‌شود.