OpenGraph ইমেজ হল OpenGraph ট্যাগের জন্য ব্যবহৃত ইমেজ, যা Twitter, Facebook এবং Open Graph প্রিভিউতে প্রদর্শিত হয়।
OpenGraph ইমেজ স্থির বা গতিশীল হতে পারে। এটি নির্ভর করে সেগুলি একটি OpenGraph জেনারেটর বা অন্যান্য টুল ব্যবহার করে তৈরি করা হয়েছে কিনা।
OpenGraph জেনারেটর ব্যবহার করে তৈরি করা ইমেজগুলি সাধারণত স্থির, কারণ সেগুলি আপনার প্রদান করা মেটাডেটার উপর ভিত্তি করে তৈরি করা হয়, যা সাধারণত স্থির। উদাহরণস্বরূপ, যদি আপনি একটি ব্লগ পোস্টের জন্য মেটাডেটা প্রদান করেন, OpenGraph জেনারেটর সেই মেটাডেটার উপর ভিত্তি করে একটি স্থির OpenGraph ইমেজ তৈরি করবে।
অন্যান্য টুল ব্যবহার করে তৈরি করা ইমেজগুলি গতিশীল হতে পারে। উদাহরণস্বরূপ, যদি আপনি OpenGraph ইমেজ তৈরি করতে একটি সার্ভার-সাইড রেন্ডারিং ফ্রেমওয়ার্ক ব্যবহার করেন, এই ইমেজগুলি ব্যবহারকারীর আচরণ, সময়, আবহাওয়া বা অন্যান্য গতিশীল তথ্যের উপর ভিত্তি করে তৈরি করা যেতে পারে।
টুল ব্যবহার করে OpenGraph ইমেজ তৈরি করুন
OpenGraph HTML কোড
<meta property="og:url" content="https://example.com/article">
<meta property="og:title" content="আমার আর্টিকেলের শিরোনাম">
<meta property="og:description" content="এটি আমার আর্টিকেলের বর্ণনা">
<meta property="og:type" content="article">
<meta property="og:image" content="https://example.com/og-image.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:type" content="image/png">
<meta property="og:image:alt" content="OpenGraph">
এই HTML কোডের সাথে, পেজটি OpenGraph-এ https://example.com/og-image.png
ইমেজ প্রদর্শন করবে।
প্রিভিউ ইফেক্টস
OG ইমেজ তৈরি করার পরে, অনেক ওয়েবসাইট আপনাকে সমস্যা নির্ণয় করতে সাহায্য করার জন্য অনলাইন প্রিভিউ এবং ডিবাগিং টুল প্রদান করে। এখানে কিছু সাধারণ টুল রয়েছে:
ওয়েবসাইট | লিঙ্ক |
---|---|
https://developers.facebook.com/tools/debug/ | |
https://www.linkedin.com/post-inspector/ | |
Discord | https://discord.com/developers/embeds |