0

OG Image Generator - صانع صور المشاركة الاجتماعية

أنشئ صورة مشاركة اجتماعية بحجم 1200 × 630 Open Graph مع عنوان وعنوان فرعي وخلفية وشعار، ويتم عرضها مباشرة على لوحة قماشية حقيقية - ثم قم بمعاينة كيف تبدو مؤطرة داخل بطاقات رابط Twitter/X وFacebook وLinkedIn وDiscord قبل تنزيل PNG النظيفة.

Buy Me a Coffee at ko-fi.com
جارٍ المعالجة... 0%
تأليف الصورة
تقديم معاينات النظام الأساسي
تم

النتيجة

صورة Open Graph هي الصورة التي تظهر عندما يتم لصق رابط في محادثة أو تغريدة أو قناة Slack - وكل منصة تعرض تتوقع لوحة قماشية بحجم 1200 × 630 بكسل تقريبًا، وقد تم تصميم كل من بطاقات og:image الخاصة بـ Facebook وبطاقات Summary_large_image الخاصة بـ Twitter. إذا أخطأت في الحجم، فستظهر الصورة مقصوصة أو ضبابية أو مضغوطة؛ أخطأ في التخطيط وسيُقرأ العنوان كشظية غير مقروءة مقابل صورة مزدحمة. تقوم هذه الأداة بتكوين الصورة بالدقة المستهدفة الحقيقية باستخدام Canvas 2D API، لذا فإن ما تراه في المعاينة هو شبكة البكسل الدقيقة التي تأتي في PNG.

اختر خلفية - لون مسطح، أو تدرج خطي متوقفين مبني من لونين تختارهما، أو صورة تم تحميلها يتم اقتصاصها لملء الإطار الكامل مقاس 1200 × 630 بنفس طريقة حجم خلفية CSS: الغلاف، بدلاً من تمديدها بشكل غير متناسب. اكتب عنوانًا وعنوانًا فرعيًا اختياريًا: يتم قياس كليهما حرفًا بحرف وفقًا لمقاييس الخط الخاصة باللوحة، لذا فإن العنوان الطويل جدًا بحيث لا يمكن احتواؤه على سطر واحد يلتف على سطر ثانٍ أو ثالث عند حدود الكلمة الحقيقية بدلاً من إبعاد الحافة أو اقتطاعها بشكل غير مرئي. اختر محاذاة للوسط أو لليسار، واختر لون نص يمكن قراءته على خلفيتك، ثم قم بإسقاط شعار اختياري في الزاوية بحجم ثابت وقابل للقراءة.

أسفل اللوحة، توجد أربع بطاقات صغيرة تقريبية لكيفية ظهور الصورة النهائية بمجرد أن تقوم منصة حقيقية بتغليفها بالكروم الخاص بها: تعرض بطاقة Twitter/X فقط النطاق والعنوان الغامق أسفل الصورة بدون سطر وصف، ويضيف Facebook شريط نطاق كبير فوق كتلة العنوان والوصف، ويضع LinkedIn المجال أسفل العنوان بدون وصف على الإطلاق، ويضع تضمين Discord المجال والعنوان والوصف فوق الصورة في مظهره المظلم الخاص به. هذه عبارة عن تقديرات تقريبية لأغراض التخطيط - تم تصنيفها بوضوح على أنها توضيحية، مع سطر مجال تكتبه بنفسك - وليست جلبًا مباشرًا أو لقطة شاشة للمنصات الفعلية، نظرًا لأن مشاركة رابط والسماح لزاحف كل نظام أساسي بقراءة العلامات الوصفية الحقيقية لصفحتك og:image وog:title هو ما ينتج البطاقة المباشرة بالفعل.

يتم عرض كل شيء محليًا على عنصر قماش HTML في متصفحك: لا يغادر العنوان والعنوان الفرعي والخلفية التي تم تحميلها والشعار جهازك أبدًا، والملف المُصدَّر عبارة عن ملف Canvas.toBlob() PNG نظيف يحتوي فقط على ما قمت بتأليفه - لا توجد حدود بالحجم الطبيعي أو أشرطة متصفح زائفة أو شعارات منصة يتم دمجها في الصورة التي تم تنزيلها. إذا كنت بحاجة أيضًا إلى تغيير حجم ملف PNG الذي تم تصديره أو تحويله بعد ذلك، فإن أدوات تغيير حجم الصور وتحويل الصور في هذا الموقع ستبدأ من حيث تنتهي هذه الأداة.