如何显示Facebook共享小部件的标题，描述和图像

how to display title, description and image for facebook share widget

本文关键字：标题 描述 图像 小部 共享 何显示 显示 Facebook      更新时间：2023-09-26

因为我是facebook API的新手，在我的网站上使用facebook share小部件。它工作正常，但现在我希望我的共享小部件在用户单击我的网站中的视频小部件时发布特定视频的描述和拇指图像。目前，它正在发布标题，链接（动态）和图像（显示相应页面的所有图像）的良好状态。但是我只想显示该视频的特定拇指图像，而是所有图像。请在这个问题上帮助我。我已经浏览了Facebook元标签og：'title'，og：'description'和og：'image'。但是它们都没有很好地工作..

这是我网站的链接：

http://www.reportershub.com/profile/john_raj

这是我的代码。

<div id="fb-root"></div>
<html xmlns:fb="http://ogp.me/ns/fb#">

<fb:share-button href="http://<?php echo $_SERVER['SERVER_NAME']; ?>/tvnews/<?php echo $videos[0]['indexer']; ?>/<?php echo empty($videos[0]['title_seo']) ? $videos[0]['title'] : $videos[0]['title_seo']?>/success/videos/news" type="box_count"></fb:share-button>

<script>
                  window.fbAsyncInit = function() {
                    FB.init({
                      appId      : '',
                      //status     : true,
                      xfbml      : true
                    });`enter code here`
                  };
                  (function(d, s, id){
                     var js, fjs = d.getElementsByTagName(s)[0];
                     if (d.getElementById(id)) {return;}
                     js = d.createElement(s); js.id = id;
                     js.src = "//connect.facebook.net/en_US/all.js";
                     fjs.parentNode.insertBefore(js, fjs);
                   }(document, 'script', 'facebook-jssdk'));
                </script>

除了meta，你也可以使用 facebook sharer link -

http://www.facebook.com/sharer.php?s=100&p[title]=titleheresexily&p[url]=http://www.mysexyurl.com&p[summary]=mysexysummaryhere&p[images][0]=http://www.urltoyoursexyimage.com

开放图（OG）被推荐并广泛用于Facebook，Twitter，LinkedIn等社交网站，列表继续...

下面是Facebook OG meta的代码

<!-- for Facebook -->          
<meta property="og:title" content="" />
<meta property="og:type" content="article" />
<meta property="og:image" content="" />
<meta property="og:url" content="" />
<meta property="og:description" content="" />

下面的链接将帮助您进一步调试元

调试器

示例如何使用 OG 标签，

教程/参考

关于OG协议

关于奥格

相关文章：