Jekyll开发:实现带可选链接的作者署名及站点标题回退逻辑
解决Jekyll文章添加带可选链接的「Posted by」副标题问题
我来帮你搞定这个「Posted by」副标题的需求,不用硬编码,用Jekyll的Liquid模板语法就能优雅实现所有场景的判断逻辑。
首先,你需要在文章的布局文件(比如_layouts/post.html)里添加这段代码,位置放在文章标题下方合适的地方:
<p class="posted-by"> Posted by: {% if page.author %} {% if page.author_url %} <a href="{{ page.author_url }}">{{ page.author }}</a> {% else %} {{ page.author }} {% endif %} {% else %} {{ site.title }} {% endif %} </p>
这段代码的逻辑很清晰:
- 先检查当前文章的front matter里有没有定义
author- 如果有,再检查是否同时定义了
author_url:有就输出带链接的作者名,没有就输出纯文本作者名 - 如果没有定义
author,就自动回退显示站点配置里的site.title
- 如果有,再检查是否同时定义了
接下来给你对应不同配置的效果验证:
- 文章front matter同时配置作者和链接:
--- title: 我的测试文章 author: Someone author_url: https://their_site.com ---
输出效果:Posted by: <a href="https://their_site.com">Someone</a>(也就是显示可点击的Someone链接)
- 只配置作者名:
--- title: 我的测试文章 author: Someone ---
输出效果:Posted by: Someone
- 完全不配置作者:
--- title: 我的测试文章 ---
输出效果:Posted by: Acme corp(假设你的站点title是Acme corp)
如果你的站点有多个布局需要用到这个逻辑,建议把这段代码抽成复用组件:
- 在
_includes目录下创建posted-by.html文件,把上面的Liquid代码放进去 - 然后在需要的布局文件里用
{% include posted-by.html %}引用即可,这样维护起来更方便
内容的提问来源于stack exchange,提问作者Adam Matan
相关产品推荐
相关产品推荐

