关于为我的网站使用 Facebook SDK 的问题

Question

我目前正在建立一个技术和黑客新闻网站以及教程。我相信我已经设置了所有 Open Graph 标签，因为它在 Facebook 中共享时可以正确显示。这是我的问题。

我需要一个 App ID 吗？共享调试器说我需要一个，但这不是应用程序。
我真的需要管理员元标记吗？我记得把它添加到我的网站上了，但是我找不到最初找到它的地方了。
引用插件似乎无法在我分配给 class "fb-quote."
最后，看起来我正在为 Facebook 做 Open Graph 标签和所有正确的事情吗？我以前从未使用过它们。

这是我的 index.php 源代码。感谢您阅读本文！此页面绝不是完整的，颜色已关闭，因此我可以看到 div 标签。这是实际站点的 link，因此您可以测试引用插件。 Ken's Tech Link

<!doctype html>
<html lang="en-US"
      itemscope 
      itemtype="http://schema.org/WebPage" 
      prefix="og: http://ogp.me/ns#" >
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=yes,minimum-scale=1">
    <meta name="description" itemprop="description" content="Programming projects, blogging, computer security, and anything related to technology.">
    <meta name="keywords" itemprop="keywords" content="computer,science,diy,tech,technology,ken,clark,blog,programming,dev,projects,electronics,tutorial,tutorials">
    <meta name="author" itemprop="author" content="Ken Clark">

    <meta property="fb:admins" content="100006702279209" />
    <meta property="og:title" content="Home | Ken&#039;s Tech Link" />
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://kenstech.link/" />
    <meta property="og:image" content="https://kenstech.link/content/images/favicon.png" />
    <meta property="og:site_name" content="Ken&#039;s Tech Link" />
    <meta property="og:description" content="Programming projects, blogging, computer security, and anything related to technology." />
    <meta itemprop="image" content="https://kenstech.link/content/images/favicon.png">
    <meta itemprop="typicalAgeRange" content="16-">
    <meta itemprop="publisher" content="Ken&#039;s Tech Link">
    <meta itemprop="contentRating" content="MPAA PG-13">

    <link rel="author" href="https://plus.google.com/117128704888871471789" />


    <!-- CSS Includes -->
    <link rel="stylesheet" type="text/css" href="content/css/index.css">

    <!--[if IE]><link rel="shortcut icon" href="content/images/favicon32x32.ico" type="image/x-icon"><![endif]-->
    <link rel="icon" type="image/png" href="content/images/favicon.png" />

    <title>Home | Ken&#039;s Tech Link</title>

  </head>

  <body>
    <script type="text/javascript">
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
        (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
        m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                              })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

      ga('create', 'UA-78291630-1', 'auto');
      ga('send', 'pageview');

    </script>

    <script type="text/javascript">

      WebFontConfig = {

        google: { families: [ 'Open+Sans:400,400italic,700,700italic:latin' ] }

      };

      (function() {

        var wf = document.createElement('script');

        wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/webfont.js';

        wf.type = 'text/javascript';

        wf.async = 'true';

        var s = document.getElementByTagName('script')[0];

        s.parentNode.insertBefore(wf, s);

      })();
    </script>

    <div id="fb-root"></div>
    <script type="text/javascript">(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/sdk.js#xfbml=1&version=v2.6";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

    <!-- How dare you look at my source code, you peasent! -->
    <div id="wrapper">
      <div class="main-menu-container">
        <div class="main-menu-item"><a href="https://kenstech.link/">Home</a></div>
        <div class="main-menu-item"><a href="/whoami.php">About Me</a></div>
        <div class="main-menu-item"><a href="/contact.php">Contact Me</a></div>
        <div class="main-menu-item">TEMP TXT</div>
      </div>
      <div id="maincontent" class="fb-quote">
        <h1>This page is still a work in progress. Please check back later.</h1>
        <p><b>You may view my blog in the meantime: <a href="/blog">Ken's Tech Link Blog</a></b></p>
      </div><!-- maincontent end -->
    </div>
    <div id="footer">
      <div class="footer-item-left">
        <div
             class="fb-like"
             data-share="true"
             data-width="300"
             data-show-faces="true">
        </div>
      </div>
      <div class="footer-item-center">
        <p>This is temporary text that means nothing. Ignore it or else.</p>
      </div>

      <div class="footer-item-right">
        TEMP
      </div>
    </div>
  </body>
</html>

Answer 1

Do I need an App ID just for this? The Share Debugger says I need one, but this is not an app.

仅当您希望分享归因于您的应用时。由于您没有开始，因此可以忽略此警告。

Do I really need the admins meta tag?

仅当您使用评论插件，并希望能够通过 Facebook 提供的界面管理这些评论时。

The quote plugin does not seem to be working on the main body which I assigned to the class "fb-quote."

文档中的示例代码与您尝试的代码有很大不同。

fb-quote 需要是一个 extra，空元素。您正试图将整个内容 包装到 中，这绝对不是文档中示例显示的内容。

And finally, does it look like I am doing the Open Graph tags and everything right for Facebook?

如果调试工具令人满意（没有真正的错误，只是关于应用程序 ID 和管理员元标记等内容的警告），并且在共享时一切都按预期显示 – 那么可能是:)

去检查 https://developers.facebook.com/docs/sharing/webmasters#markup and https://developers.facebook.com/docs/sharing/best-practices#tags 看看还有哪些额外的 OG 元标记，以及是否要使用它们。

关于为我的网站使用 Facebook SDK 的问题

Questions On Using the Facebook SDK For my Website

html

javascript

facebook

facebook-graph-api

facebook-opengraph