Hugo 添加知乎卡片式链接 Shortcodes
目录
注意
本文最后更新于 2023-11-30,文中内容可能已过时。
回顧
之前在使用 hexo 的時候也有用到,模仿知乎卡片式链接
和之前的相比,優化之前是后加載,由 JS 在 瀏覽器處理,
使用 shortcodes 方式后,則是在 GO 構建頁面的時候處理,效能上會好很多。
和之前的相比,優化之前是后加載,由 JS 在 瀏覽器處理,
使用 shortcodes 方式后,則是在 GO 構建頁面的時候處理,效能上會好很多。
1 源碼
基於 LoveIt 主題的 Link Shortcodes, 主要改到以下幾個文件,完整提交記錄
assets/css/custom.scss
assets/css/partial/cardlink.scss # 卡片式鏈接樣式
layouts/partials/plugin/cardlink.html # 卡片式鏈接模板
layouts/shortcodes/cardlink.html
static/images/card-link-bg.jpg
2 使用
使用參數见 FixIt 擴展 Shortcodes - Link
|
|
💡 注:FixIt 已合併 shortcode cardlink 到 shortcode link,只需添加
card=true
|
|
信息
我的博客即将同步至腾讯云 + 社区,邀请大家一同入驻:
https://cloud.tencent.com/developer/support-plan?invite_code=3o5dmfzf0xkwk
https://cloud.tencent.com/developer/support-plan?invite_code=3o5dmfzf0xkwk
相关内容
- Hugo 本地管理 Shell 腳本
- Hugo I18n 添加中文繁體翻譯
- Hugo 友情連結模板
- Hugo 使用 GitHub Actions 部署到 GithHb Pages 和 腾讯云 cos 桶
- 个人博客从 Hexo 迁移至 Hugo
Buy me a coffee~
支付宝
微信