在html-head中拾取元标记的顺序
我想知道是否有人能解释社交媒体丰富的预览如何定义选择哪个og:title。
我使用wordpress，对于某些页面，我插入php回显字符串将它们注入到<head>中。我选择这样做是为了将某些标题和描述转换为更多的商业文本。值得注意的是，有两个og:title元标签；我的注入一个和Wordpress后端页面标题。
有一次，我被告知，<head>顶部的第一个元标记将被选择为thémeta标记，用于丰富的预览(例如)，但这似乎不再发生了。
下面是我当前的情况和<head>中元标记的确切顺序
<html>
<head>
<meta charset="UTF-8">
<title>EXAMPLE</title> // my injected and used by Google
<link rel="canonical" content="https://example.com">
<meta name="description" content="description">
<meta name="subject" content="example">
<meta name="og:image" content="/image.jpg"> // my injected and used by Social Media
<meta property="og:title" content="og:title #1"> // my injected og:title, but ignored
<meta property="og:description" content="description">
<meta property="og:url" content="https://example.com">
<meta name="twitter:title" content="EXAMPLE">
<meta name="twitter:description" content="description">
<link rel="alternate" href="https://example.com" hreflang="nl-nl">
<link rel="alternate" href="https://example.com" hreflang="nl-be">
<title>EXAMPLE</title> // default by Wordpress
<meta property="og:title" content="og:title #2"> // default by Wordpress and being used
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com">
<meta name="og:image" content="/image.jpg"> // default by Wordpress
</head>
</html>
结果是Whatsapp和Facebook采用了第二个og:title元标签，这在我看来是没有意义的。
更改后端的标题页不是一个解决方案，因为它变成了类似于查看我们的精彩商店！，这是不友好的用户。另外，我也不是Yoast的粉丝，因为Yoast将额外的代码加载到页面中，这是我不想要的。
谁知道解决这个问题的办法，或者能解释为什么会发生这种情况？
更新&应答
感谢克里斯，我了解到在<head>中og: meta标记是从上到下扫描的，并且用正在扫描的最后一个属性更新两个相同的属性。这个RDFa过程对于Facebook、Whatsapp、Twitter等应用程序来说是典型的。一个例外:在顶部似乎需要 og:image，它不会覆盖它下面的第二个或第三个。
谷歌搜索相关的标签正在被第一个在<head>顶部的标签选中，并将其保留为“先到先得”。
解决方案：I将把og:标记注入<head>的底部，其他标记将保留在顶部。测试过了就成功了。
回答 1
Stack Overflow用户
发布于 2019-03-14 16:54:20
Facebook和其他应用程序通常使用自己精简的RDFa解析版本，据我理解，这是一种解析来自xml和html文档的元数据的方法。据我所读，当解析器遍历您的html页面时，它会将它找到的第一个元数据添加到它的“当前主题”中，如果它找到另一个同名的元数据，它将用更新的信息覆盖“当前主题”。
这似乎是一个相当复杂的话题，所以我想简单的答案就是他们的解析器总是使用最后一个元数据标记并使用它。
为了解决这个问题，我想看看你能否在Wordpress注入的自定义og:title/元数据下面注入您的自定义og:title/元数据。
https://stackoverflow.com/questions/55167667
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号