前言

以下ShortCode均可以被视为非原创实现，部分来自网上其他作者的源码，就算是首创，我也会说是GPT辅助实现，所以如果要引用，标注一下本文地址即可。

本文更多是为了快速测试我自己写的代码，和方便我复制使用。如对你有帮助，那我非常荣幸。ShortCode是Hugo全主题通用的。需要源码可以从页面最底下的主题提示超链接点击前往或者点下面这个（如果我忘记更新主题仓，可以留言跟我要）。

{{< git platform="github" repo="ZaNksC/hugo-theme-fund" >}}

更优质的提示： Admonition

来自某个 paper-mod 同好者的实现，但据我考证是来自其他框架或主题，具体来源就不找了，这个的实现挺泛滥的。

{{< admonition type=success title="Success" open=true >}}

• 已实现基本功能
• 折叠已修复 {{< /admonition >}}

效果展示

{{< admonition type=note title="Note" open=true >}} 一个 笔记 横幅 {{< /admonition >}} {{< admonition type=abstract title="Abstract" open=true >}} 一个 基础 横幅 {{< /admonition >}} {{< admonition type=info title="Info" open=true >}} 一个 消息 横幅 {{< /admonition >}} {{< admonition type=tip title="Tip" open=true >}} 一个 技巧 横幅 {{< /admonition >}} {{< admonition type=success title="Success" open=true >}} 一个 成功 横幅 {{< /admonition >}} {{< admonition type=question title="Question" open=true >}} 一个 问题 横幅 {{< /admonition >}} {{< admonition type=warning title="Warning" open=true >}} 一个 警告 横幅 {{< /admonition >}} {{< admonition type=failure title="Failure" open=true >}} 一个 失败 横幅 {{< /admonition >}} {{< admonition type=danger title="Danger" open=true >}} 一个 危险 横幅 {{< /admonition >}} {{< admonition type=bug title="Bug" open=true >}} 一个 bug 横幅 {{< /admonition >}} {{< admonition type=example title="Example" open=true >}} 一个 举例 横幅 {{< /admonition >}} {{< admonition type=quote title="Quote" open=true >}} 一个 引用 横幅 {{< /admonition >}}

使用方式

{{</* admonition type=note title="Note" open=true */>}} 一个 **笔记** 横幅 {{</* /admonition */>}}
{{</* admonition type=abstract title="Abstract" open=true */>}} 一个 **基础** 横幅 {{</* /admonition */>}}
{{</* admonition type=info title="Info" open=true */>}} 一个 **消息** 横幅 {{</* /admonition */>}}
{{</* admonition type=tip title="Tip" open=true */>}} 一个 **技巧** 横幅 {{</* /admonition */>}}
{{</* admonition type=success title="Success" open=true */>}} 一个 **成功** 横幅 {{</* /admonition */>}}
{{</* admonition type=question title="Question" open=true */>}} 一个 **问题** 横幅 {{</* /admonition */>}}
{{</* admonition type=warning title="Warning" open=true */>}} 一个 **警告** 横幅 {{</* /admonition */>}}
{{</* admonition type=failure title="Failure" open=true */>}} 一个 **失败** 横幅 {{</* /admonition */>}}
{{</* admonition type=danger title="Danger" open=true */>}} 一个 **危险** 横幅 {{</* /admonition */>}}
{{</* admonition type=bug title="Bug" open=true */>}} 一个 **bug** 横幅 {{</* /admonition */>}}
{{</* admonition type=example title="Example" open=true */>}} 一个 **举例** 横幅 {{</* /admonition */>}}
{{</* admonition type=quote title="Quote" open=true */>}} 一个 **引用** 横幅 {{</* /admonition */>}}

代码仓展示的逼格之选: Git

这个实现也是来自于网络，实在是不记得从哪里抄的了。目前我只用Github平台，所以不太清楚具体支持哪些平台。

效果展示

{{< git platform="github" repo="ZaNksC/hugo-theme-fund" >}}

使用方式

{{</* git platform="github" repo="ZaNksC/hugo-theme-fund" */>}}

万能小徽章: Badge

效果展示

{{< badge text="Pro" emoji="🚀" bgColorStart="#f7971e" bgColorEnd="#ffd200" textColor="#3c2a00"

}}

{{< badge text="原创" emoji="📌" bgColorStart="#f7971e" bgColorEnd="#ffd200" textColor="#3c2a00"

}}

{{< badge text="转载" emoji="🔗" bgColorStart="#9E9E9E" bgColorEnd="#607D8B" textColor="#FFFFFF"

}}

使用方式

{{/*< badge
text="Pro"
emoji="🚀"
bgColorStart="#f7971e"
bgColorEnd="#ffd200"
textColor="#3c2a00"
*/>}}

信用卡持卡展示: CreditCard

在整理手里的信用卡，技术先行了属于是。

效果展示

{{< credit-card image="/images/default/ca111rd.png" issuer="招商银行" network="Visa" level="白金卡" status="inactive" name="招商银行经典白金卡" >}}

{{< credit-card-fee >}}

• 首年免，次年刷6次免年费
• 详情见官网 招商银行官网 {{< /credit-card-fee >}}

{{< credit-card-benefits >}}

• 机场贵宾厅
• 航班延误险
• 免费道路救援 {{< /credit-card-benefits >}}

{{< /credit-card >}}

使用方式

{{</* credit-card
image="/images/default/card.png"
issuer="招商银行"
network="Visa"
level="白金卡"
status="inactive"
name="招商银行经典白金卡" */>}}

{{</* credit-card-fee */>}}
- 首年免，次年刷6次免年费
- 详情见官网 [招商银行官网](https://cmbchina.com)
{{</* /credit-card-fee */>}}

{{</* credit-card-benefits */>}}
- 机场贵宾厅
- 航班延误险
- 免费道路救援
{{</* /credit-card-benefits */>}}

{{</* /credit-card */>}}

设备展示墙：Card-list 与 Device

不是，你知道吗，我软路由超牛的好吗。每年过年别人都在谈论赚了多少钱，他们根本不懂我们设备党的软路由有多牛！

效果展示

{{< card-list >}} {{< device img="/test.png" time="1970.01.01 - 至今" price="998" config="24口400g网口 99C10GhzCPU 2666G内存" >}} 一台超牛的软路由，黑盒子革命！ {{< /device >}}

{{< device img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="red">}} 我手机屏幕刷新率2000hz你顶得住吗 {{< /device >}}

{{< device img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="green">}} 我手机屏幕刷新率2000hz你顶得住吗 {{< /device >}}

{{< device img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="yellow">}} 我手机屏幕刷新率2000hz你顶得住吗 {{< /device >}}

{{< device img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="gray">}} 我手机屏幕刷新率2000hz你顶得住吗 {{< /device >}} {{< /card-list >}}

使用方式

{{</* card-list */>}}
{{</* device 
    img="/test.png" time="1970.01.01 - 至今" price="998" config="24口400g网口 99C10GhzCPU 2666G内存" */>}}
一台超牛的软路由，黑盒子革命！
{{</* /device */>}}

{{</* device 
    img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="red"*/>}}
我手机屏幕刷新率2000hz你顶得住吗
{{</* /device */>}}

{{</* device 
    img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="green"*/>}}
我手机屏幕刷新率2000hz你顶得住吗
{{</* /device */>}}

{{</* device 
    img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="yellow"*/>}}
我手机屏幕刷新率2000hz你顶得住吗
{{</* /device */>}}

{{</* device 
    img="/images/default/phone.webp" time="1970.01.01 - 至今" price="1998" config="2000hz高刷手机" style="gray"*/>}}
我手机屏幕刷新率2000hz你顶得住吗
{{</* /device */>}}
{{</* /card-list */>}}

更好看的超链接：Link

灵感来自: 唐玥璨的博客

效果展示

{{< card-list >}}

{{< link title="Google" gotoText="各显神通" img="/images/default/google-icon.webp" style="green">}} 听说这是一个神秘而强大的网站，只有强大的勇士才可以站在他的面前挑战他 {{< /link >}}

{{< link title="阿里云" link="https://www.aliyun.com/" >}} 阿里云，很牛 {{< /link >}}

{{< /card-list >}}

使用方式

{{</* card-list */>}}

{{</* link title="Google" gotoText="各显神通" img="/images/default/google-icon.webp" style="green"*/>}}
听说这是一个神秘而强大的网站，只有强大的勇士才可以站在他的面前挑战他
{{</* /link */>}}

{{</* link title="阿里云" link="https://www.aliyun.com/" */>}}
阿里云，很牛
{{</* /link */>}}

{{</* /card-list */>}}

铲屎官&数据控的狂喜： Cat-Food

效果展示

{{< card-list >}}

{{< cat-food title="美式一分二餐盒" from="美国" size="37.5g x 2" series="一分二" edition="鸡肉和鸡肝" rating="7" price="135/12盒">}} 从小吃到大的性价比餐盒，自从妈妈给买了其他的之后就不再买这个了。变成年回忆了！ {{< /cat-food >}}

{{< cat-food title="美式一分二餐盒" from="美国" size="37.5g x 2" series="一分二" edition="鸡肉和鸡肝" rating="7" price="135/12盒" style="green">}} 从小吃到大的性价比餐盒，自从妈妈给买了其他的之后就不再买这个了。变成童年回忆了！ {{< /cat-food >}}

{{< /card-list >}}

使用方式

{{</* card-list */>}}

{{</* cat-food title="美式一分二餐盒" from="美国" size="37.5g x 2" series="一分二" edition="鸡肉和鸡肝" rating="7" price="135/12盒"*/>}}
从小吃到大的性价比餐盒，自从妈妈给买了其他的之后就不再买这个了。变成年回忆了！
{{</* /cat-food */>}}

{{</* cat-food title="美式一分二餐盒" from="美国" size="37.5g x 2" series="一分二" edition="鸡肉和鸡肝" rating="7" price="135/12盒" style="green"*/>}}
从小吃到大的性价比餐盒，自从妈妈给买了其他的之后就不再买这个了。变成童年回忆了！
{{</* /cat-food */>}}

{{</* /card-list */>}}