搜索martyfriedel / les-mills-class-types
Statamic 4中 Bard 的自定义按钮，允许为选定的文本添加带有类的 span 元素。在此实例中，是 Les Mills 团体健身课程类型。
Requires
- statamic/cms: ^4.0
README
这是一个 Statamic 4 的 Bard 插件示例，它添加一个带有类的 span 元素到选定的内容。在此示例中，您可以从中选择多个 Les Mills 团体健身课程。
此插件已更新以兼容 Statamic 4。它将不再在 Statamic 3.x 上工作。但是，您可以使用 1.x 版本用于 Statamic 3。
虽然这是我个人使用的目的，但它也展示了如何使用元素包装选定的内容并添加类的简单示例。这确实有许多用例，而不仅仅是像这个示例这么简单。
我个人将直接使用这个包...但对于其他人来说，这是一个简单且有效的示例，说明如何在 Statamic 4 中编写自己的 Bard 插件。
安装
通过 composer 命令安装
composer require martyfriedel/les-mills-class-types
在 Bard 编辑器实例中（注意，不是 配置视图），您将看到添加的新按钮。
选择一些文本，点击新图标，并选择一个类类型，然后 voilà！
输出
输出时，标记将为带有类的 span 元素。
<p>This is my text with <span class="les-mills-class bodyattack">BodyAttack</span> highlighted using the addon.</p>
在前端使用
包含了一些程序（我教的那几个）的样式，并将样式应用于 Statamic 管理区域内的选定文本。
您需要在您的前端样式表中添加类，才能在那里看到它们。
基本上，它将添加一个通用的类 les-mills-class，后面跟着程序名称 - 因此，您可以针对所有课程类型，然后根据每个程序进行调整。
例如，一个完成的课程可能是 les-mills-class bodyattack。
然后，您的前端 CSS 可以针对那个特定的类进行定位。
.les-mills-class { text-transform: uppercase !important; font-weight: bold !important; &.bodyattack { color: #FCC500 !important; } /* more class types */ }
许可证
此插件采用 MIT 许可证。
Les Mils
Les Mills 是一家新西兰公司，他们制作了世界上最好的团体健身课程，包括 BODYPUMP - 我已经接受过他们5个项目的培训，并且教授 Les Mills 团体健身课程已经超过14年。他们“L”字母仅用于此插件按钮的演示目的。