Hello दोस्तों, आज में आपको बताने वाला हूँ की blogger में Blogspot ब्लॉग में facebook open graph कैसे add करते हैं? इसके लिए में आपको बहुत ही simple process बताऊंगा, जिससे आप अपने ब्लॉग के सभी posts और pages में open graph add कर सकते हो. चलिए last तक इस पोस्ट को पढ़िए.

Social media हमारे लिए बहुत जरुरी होता है. यह एक बहुत अच्छा जगह है जहाँ से हम अपने ब्लॉग पर लाखों ट्रैफिक generate कर सकते हैं. इसकी मदद से हम बहुत सारे काम को easily कर सकते हैं. ऐसे कई सारे websites हैं, जिनमे सबसे ज्यादा ट्रैफिक social media से ही आता है.

ख़ास तौर से news sites में सबसे अधिक ट्रैफिक social media से ही आता है. ऐसे में वे लोग अपने site को social media के लिए पूरी तरह से optimize करके रखते हैं. जिससे अगर कोई उसके पोस्ट को कोई social media में share कर देते हैं तो काफी अच्छा perform कर पाते हैं.

कई सारे नये blogger जब अपने पोस्ट को facebook या किसी social media में share करता है तो उसके पोस्ट का structure ठीक नही होता है, जिसके कारण उनका पोस्ट अच्छा perform नही कर पाता है. मतलब उनके पोस्ट का title, description, thumbnail ये सब show नही होता है, जिससे उसका look भी better नही होता है.

Recently, मेरे ब्लॉग में किसी ने comment भी किया था की जब में facebook में post URL share करता हूँ तो वहाँ title, description और thumbnail show नही होता है. तो मेने उसे बताया की उसके ब्लॉग में facebook open graph नही है, इसीलिए ऐसा हो रहा है.

इस पोस्ट में हम आपको बताने जा रहे हैं की blogger ब्लॉग में facebook open graph data कैसे add करें? अगर आपका ब्लॉग wordpress पर है तो आप Yoast SEO जैसे plugin का use कर सकते हो. ये आपके site के सभी pages में facebook open graph add कर देंगे.

Blogger में Facebook Open Graph कैसे Add करते हैं?

चलिए अब में आपको step by step बता रहा हूँ. इसमें आपको कुछ codes को अपने ब्लॉग के टेम्पलेट में add करने होंगे, उसके बाद आपके ब्लॉग के सभी pages और posts में facebook open graph add हो जायेंगे.

Step 1: सबसे पहले आप Blogger ब्लॉग में login करके Dashboard >> Theme >> Edit HTML में जाइये.

Step 2: अब आपको CTRL+F को दबा कर <html को search करना है और > से पहले आपको निचे दिए code को add कर देना है.

xmlns:og='http://ogp.me/ns#'

अब save कर दीजिये. आप निचे screenshot में देख सकते हो.

Step 3: अब आपको फिर से </head> को find करना है. (अगर नही मिले तो सिर्फ </head search करें) उसके बाद आपको </head> से पहले निचे दिए गये code को add कर देना है.

<!-- Begin Open Graph metadata -->
<meta expr:content='&quot;en_US&quot;' property='og:locale'/> <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta content='article' property='og:type'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='Img-URL-If-No-Image' property='og:image'/>
</b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<!-- Still looking for a way to use the post snippet if there's no description -->
</b:if>
<!-- End Open Graph metadata -->

Note:

इस code में Img-URL-If-No-Image के जगह में आपको उस thumbnail का URL add करना है, जो पोस्ट में thumbnail नही होने पर show होगा.
अगर आपका facebook app associated account है तो आप निचे दिए meta को भी <!– End Open Graph metadata –> से पहले add कर देना है.

अब इसको save कर दीजिये. आप निचे screenshot भी देख सकते हो.

अब आपके ब्लॉग में facebook open graph add हो गया है. अब आप facebook में अपने ब्लॉग की कोई भी पोस्ट URL share करेंगे तो वहाँ अपने आप आपके पोस्ट का title, description और thumbnail show होने लगेंगे. इससे सम्बन्धित अगर कोई सवाल आपके मन में है तो आप हमें comment में बता सकते हो.

इस पोस्ट को अपने दोस्तों के साथ social media में share जरुर करें.