gpt4 book ai didi

html - html-head 中元标记的顺序

转载 作者:太空狗 更新时间:2023-10-29 16:38:26 25 4
gpt4 key购买 nike

我想知道是否有人可以解释社交媒体丰富预览如何定义哪些 og:title挑选。

我使用 wordpress,对于某些页面,我插入 php 回显字符串以将它们注入(inject) <head> .我选择这样做是为了将某些标题和描述更改为更多商业文本。显然发生的是有 2 og:title元标记;我注入(inject)的一个和 Wordpress 后端页面标题。

有一次我被告知 <head> 顶部的第一个元标记例如,将被选为要为丰富的预览选择的元标记,但这似乎不会发生(不再)。

以下是我目前的情况和 <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元标记,我认为这没有意义。

在后端更改标题页不是解决方案,因为它变成了类似Check out our wonderful shop!,这不是用户友好的。另外,我不是 Yoast 的粉丝,因为 Yoast 会在页面中加载额外的代码,这是我不想要的。

谁知道这个问题的解决方案,或者可以解释为什么会这样?


更新与回答
感谢 Chris,我了解到 og: meta 标签正在 <head> 中从上到下扫描。 , 并将 2 个相同的属性更新为正在扫描的最后一个属性。此 RDFa 过程通常适用于 Facebook、Whatsapp、Twitter 等应用程序。 一个异常(exception): og:image似乎需要在顶部,它不会覆盖它下面的第二个或第三个。

Google 搜索相关标签被 <head> 顶部的第一个标签选中。并将其保留为“先到先得”。

解决方案:我将 og: 标签注入(inject)到 <head> 的底部其他的将保留在顶部。对其进行了测试,它有效。

最佳答案

Facebook 和其他应用程序通常使用自己的精简版 RDFa 解析,根据我的理解,这是一种从 xml 和 html 文档解析元数据的方法。从我读到的内容来看,似乎当解析器浏览您的 html 页面时,它会将它找到的第一个元数据片段添加到它的“当前主题”中,如果它找到另一个同名的元数据片段,它将覆盖包含更新信息的“当前主题”。

这似乎是一个相当复杂的话题,所以我想简单的答案就是他们的解析器将始终采用最后一个元数据标记并使用它。

要解决此问题,我会看看您是否可以将自定义 og:title/metadata 注入(inject)到 Wordpress 自动注入(inject)的下方。

You can read more about RDFa parsing here

关于html - html-head 中元标记的顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55167667/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com