Facebook 调试器是一种工具，可让您对任何页面上的 OpenGraph 选项卡进行分析和故障排除。使用调试器，您可以快速将社交媒体富源中的错误源归零。
由于社交媒体和 Facebook 本身是任何营销策略的关键组成部分，因此了解如何使用此工具可以大有帮助。
让我们谈谈 Facebook 调试器和 OpenGraph！
什么是 OpenGraph（以及如何在 WordPress 中添加标签）
OpenGraph 是指可用于向页面和帖子添加元数据的标签集合。社交媒体平台使用这些 OpenGraph 标签生成向用户显示的丰富网页摘要：
如果您不使用 OpenGraph 标签，社交媒体平台会在您分享页面时自动为您的页面生成摘要。但是，使用这种方法，您无法完全控制这些丰富网页摘要的外观。
这意味着如果附带的图片看起来不太好，则需要在 WordPress 中对其进行更改。如果您不喜欢 Facebook 使用的元描述，您还需要修改您的内容。总的来说，如果您想利用社交网络作为流量来源，这不是一个明智的方法。
即使是这个简单的示例，您也需要在幕后添加几个 OpenGraph 标签。对于丰富网页摘要，您需要使用以下标记：
这个例子来自之前关于 OpenGraph 标签和如何使用它们的 Elegant Topics 文章（你应该阅读！）。简而言之，有两种方法可以将 OpenGraph 标记添加到内容：
- 手动。就像架构标记一样，您可以手动将 OpenGraph 标记添加到您的页面。缺点是您必须为网站上要在社交媒体上共享的每个页面执行此操作。
- 使用插件。有很多插件可以自动为您的内容生成 OpenGraph 标签。最受欢迎的插件选项是 Yoast SEO，尽管其他我们也可以这样做。
遗憾的是，Yoast SEO 的免费版本不包含丰富网页摘要预览功能。但是，它确实使您能够使用简单的编辑器来修改内容的 OpenGraph 标记。
如果您已经在使用 Yoast SEO，利用其 OpenGraph 功能是确保您的社交媒体源看起来完全符合您的要求的最简单方法。
为什么要将 Facebook 调试器与 OpenGraph 一起使用
Facebook 调试器是一种可以帮助您确保丰富的社交媒体片段在各个方面都正常运行的工具。要使用它，只需访问 Shared Debugger Facebook 开发者页面。在这里，输入您要检查其标签的页面的网址，然后单击“调试”按钮：
您甚至不需要 Facebook 帐户即可使用调试器。一旦您分析了一个 URL，它就会向您显示其丰富网页摘要和规范 URL 的预览，例如：
如果向下滚动，可以分析页面的所有OpenGraph标签：
请记住，Facebook 调试器不允许您直接修复错误或修改标签。但是，它确实会向您展示内容在 Facebook 上的效果预览。更重要的是，如果它检测到您的 OpenGraph 标签中有错误，它还会警告您：
此特定错误是我们将在下一节中向您展示如何解决的三个错误之一。
如何使用 Facebook 调试器修复 3 个常见的 OpenGraph 错误
在本节中，我们将主要依赖 Facebook 调试器。但是，如果您使用的是 Yoast SEO，我们还将向您展示该插件如何帮助您解决一些 OpenGraph 错误。开始吧！
1.再次抓取 URL 以更新关联图片
您可能遇到的 OpenGraph 标记最常见的错误之一是 Facebook 调试器将显示过时的精选图片。发生这种情况是因为当您更新页面或帖子的关联图片时，它不会在 Facebook 上自动更新。当您对图像使用 OpenGraph 标记时，Facebook 会在其端缓存这些文件以提高性能。因此，如果您最终更新了特色图片，则需要“强制”Facebook 在旁边做同样的事情。
最简单的方法是使用 Facebook Debugger 的 Scrape Again 功能。您可以在我们上次抓取 URL 的时间和方式下找到此选项：
点击“再次拖动”按钮，查看“链接预览”部分中页面的特色图片是否发生变化。如果没有，再次单击按钮有时可以解决问题（技术含量不高，但很管用！）
如果图片上传失败，则网站可能存在缓存问题。在这种情况下，您需要清除站点的缓存，然后使用“再次拖动”按钮强制 Facebook 更新其图像信息。
2.修复“属性尚不可用”错误
og:image 标签是 OpenGraph 用来声明社交媒体平台应为每个页面显示的图像文件的标签。在某些情况下，您可能会遇到“og:image property is not yet available”错误。
这个意思是特色图片有可能是分辨率的问题。如果图像尺寸小于 200x200，则根本不起作用。
理想情况下，您为社交媒体丰富网页摘要设置的图片宽度应为 1080 像素或更高。大型特色图片不仅看起来更好，而且有助于在社交媒体上吸引人们对您的内容的关注：
如果您想了解有关图像和 og:image 标签的更多信息，优雅主题博客上还有另一篇文章。简而言之，如果 Facebook 调试器返回与图像大小相关的错误，您通常可以通过以下两种方式之一修复它：
- 使用更高分辨率的版本更新页面的特色图像（和从现在开始坚持高质量的图像！）。
- 使用 Yoast SEO 在 og:image 标签内指示其他图像文件。
对于 Yoast SEO，您可以在要更新的帖子或页面的“社交”选项卡下找到更改 Facebook 图片的选项：
更新图片或对应标签后，请使用“重新抓取”按钮。 “og:image property is not yet available”警告应该消失并且图像应该正确显示。
3.将缺少的 fb:app_id 属性添加到您的网站
让我们回到本文前面的警告：
此警告表示您的网站没有关联的 Facebook 应用 ID。您不需要 App ID 即可在社交媒体上分享您的内容，但它确实可以让您访问 Facebook Insights。
虽然 Facebook Insights 可以帮助您改进营销工作并衡量发布效果，但它需要一些设置时间。如果您有兴趣访问这些分析，您需要为您的网站生成一个 Facebook App ID。
获得 App ID 后，您可以使用 Yoast SEO 通过 fb:app_id 属性将其添加到您的页面。为此，请转到您网站上的 SEO > 社交 > Facebook 选项卡并查找 Facebook 应用程序 ID 字段：
添加您的 App ID，保存对插件设置的更改，然后您就可以开始了。从现在开始，Facebook 调试器不应返回任何与缺少的 fb:app_id 属性相关的错误。
结论
Facebook Debugger 使用起来非常简单。但是，如果没有基本的了解，您可能会遇到一些错误。 OpenGraph 标签。一般来说，如果你使用 Yoast SEO 之类的东西，你不必担心手动设置标签。
使用 Facebook 调试器，您可以通过以下方式快速解决 OpenGraph 错误：
- 再次抓取 URL 以更新关联的图像。
- 修复“og:image 属性尚不可用”的错误。
- 将缺少的 fb:app_id 属性添加到您的网站。
您对如何使用 Facebook 调试器有任何疑问吗？让我们在下面的评论部分讨论它们！
Sergey Targasov/shutterstock.com 的文章缩略图。
资源
