Featured image of post 如何在PaperMod中设置Twitter Card

如何在PaperMod中设置Twitter Card

简介

PaperMod主题支持Twitter Card。 但是,Twitter Card的设置必须写在config.toml或每篇文章的*.md头部信息中。 如果同时在文章和config.toml中进行了设置,则优先使用文章的头部信息。

设置方法

config.toml

config.toml中,在[params]下添加一个名为images的项目。 在images中,填写要在Twitter Card中显示的图像路径。 如果将图像放置在static文件夹中,只需指定文件名即可。

1
2
[params]
  images = ["twitter_card.jpg"]

文件夹结构

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
root
│  config.toml (在此编写)
├─content
│  └─posts
│      └─文章文件夹
│         │  index.md (在此编写)
│         └─images
│             cover.png (放置在此)
└─static
    twitter_card.jpg (放置在此)

各文章的头部信息

在每篇文章的头部信息中,在cover下添加一个名为image的项目。 如果将relative设置为true,则可以使用相对于文章*.md的相对路径来指定。

1
2
3
cover:
  image: "images/cover.jpg"
  relative: true

如果不想在文章顶部显示

如果不想在文章顶部显示封面图像,可以在cover下添加一个名为hidden的项目,并将其设置为true

1
2
3
4
cover:
  image: "images/cover.jpg"
  relative: true
  hidden: true

关于图像尺寸

根据目前PaperMod的规范,Twitter Card的尺寸似乎只支持summary_large_image。 关于summary_large_image的合适尺寸(分辨率)有很多说法,但大约800 x 418(图像比例 1.91:1)似乎是不错的选择。

参考网站1 参考网站2

建议您在发布前调整图像大小。

确认设置的方法

要确认Twitter Card的设置,请使用Twitter Card Validator。 但是,在我的环境中,预览没有成功显示。因此,如果没有显示预览,建议您在发布之前使用私人帐户等进行确认。

comments powered by Disqus
使用 Hugo 构建
主题 StackJimmy 设计