如何在 Grav Learn2 上制作选项卡式代码屏幕

【问题标题】：How to make tabbed code screen on Grav Learn2如何在 Grav Learn2 上制作选项卡式代码屏幕
【发布时间】：2021-03-14 09:37:37
【问题描述】：

我找不到该选项卡式代码屏幕的解决方案。谁能帮我弄清楚？

截图： https://imgur.com/3zCz0pO

这也是屏幕截图中的页面： https://dev.iyzipay.com/tr/api/taksit-sorgulama

谢谢。

【问题讨论】：

标签： screen grav tabbed

【解决方案1】：

标签是使用Grav Shortcode UI Plugin生成的。

这是来自https://learn.getgrav.org/16/content/media#url的示例：

降价

[ui-tabs]
  [ui-tab title="Twig"]
    {% verbatim %}
      {{ page.media['sample-image.jpg'].url|e }}
    {% endverbatim %}
  [/ui-tab]

  [ui-tab title="HTML Code"]
    {{ page.media['sample-image.jpg'].url|e }}
  [/ui-tab]
[/ui-tabs]

结果

以上示例的markdown来源可以在文档的repo中找到：https://github.com/getgrav/grav-learn/blob/develop/pages/02.content/07.media/docs.md

【讨论】：