给出相关文章链接(Relatedposts)。

发布系列文章时,给出相关文章链接(Relatedposts)是需要的。Wordpress Jetpack 插件可以很好地实现该功能。Jetpack 工作需要连接 wp.com,而 wp.com 国内访问受阻,所以并不能愉快地直接使用。

自己动手,把 Jetpack Relatedposts 的样式「抠」下来。检查发现,Relatedposts 样式代码分别包含在 jetpack1.css 和 jetpack2.css 当中。把这俩 CSS 直接引入到页面中,发现可行,但是不妥。一是完整引入,体积大,二是那些多出来的不相关代码,潜在有冲突的风险。我需要「按需所取」,仅要把 Relatedposts 相关代码抽取出来。

我使用浏览器 DOM 手动查找,无聊而繁琐而艰巨,而且会遗漏,这种方法笨而低效。直到找到 Critical Path CSS Generator,简直解放生产力:

1. 发布 Relatedposts HTML 代码,得到 URL;
2. 粘贴 jetpack1.css 和 jetpack2.css 全部内容;
3. 生成 Critical Path CSS!

至此,我得到我想要的: