横向/银Stripe轮播图

为您的SilverStripe网站创建轮播图的基础框架

维护者

详细信息

github.com/i-lateral/silverstripe-carousel

主页

源代码

问题

安装数: 3,514

依赖项: 1

建议者: 0

安全: 0

星标: 4

关注者: 5

分支: 4

类型:silverstripe-vendormodule

2.2.0 2022-05-27 18:37 UTC

Requires

BSD-3-Clause a21f74f3c1aff314cc6f5a126f7ccf02d5f28c9c

  • Morven Lewis-Everley <morven.woop@ilateral.co.uk>
  • Mark Anderson <mark.woop@ilateral.co.uk>

silverstripeslidercarousel

This package is auto-updated.

Last update: 2024-08-27 23:44:35 UTC

README

Scrutinizer Code Quality

GitHub license

模块，为您的SilverStripe网站添加生成轮播图/滑块的功能。

要求

  • 银Stripe框架: 4.*
  • 银Stripe CMS: 4.*

安装

通过composer安装

composer require "i-lateral/silverstripe-carousel"

或者手动下载并添加到

[silverstripe-root]/carousel

然后运行

./vendor/bin/sake dev/build flush=1

或者（从您的浏览器）

http://yoursiteurl.com/dev/build/

使用方法

以下是如何使用此模块的快速指南

步骤 1: 在模板中添加变量

安装后，您必须将以下模板变量添加到需要显示轮播图的任何模板中

$CarouselSlides

步骤 2: 在您的页面上启用轮播图

接下来，登录到管理界面，编辑您想添加轮播图的页面。

然后点击“设置”选项卡，并勾选“显示轮播图”复选框。

步骤 4: 设置轮播图

完成此操作后，您将能够设置以下字段

  • 宽度和高度设置（这将确定渲染图像的大小）
  • 显示控制（这将添加下一个/上一个按钮）注意如果希望其正常工作，您需要禁用SilverStripe中的hash重写
  • 显示指示器（在页面底部显示小点）。
  • 间隔（每个幻灯片显示的快速速度）。

步骤 5: 添加一些幻灯片

配置完成后，您可以返回到“内容”选项卡，编辑窗格的右侧应出现一个“轮播图”选项卡。

现在您可以添加幻灯片，附加图像并编辑它们的标题。

使用不同的轮播图

默认情况下，此模块使用从CDN的Bootstrap 4轮播图。如果您想使用自己的轮播图，您需要将CarouselSlides模板复制到您的主题中，并修改HTML和Requirements调用