README

Slick 内容元素用于 Neos CMS

这是 JavaScript 包 slick 的一个现成实现。

安装

通常，您需要对包进行一些小的调整（例如，Settings.yaml 中的配置）。因此，从您的主题包中添加相应的包到 composer 是很重要的。通常这是位于 Packages/Sites/ 下的站点包。要正确安装，请转到您的主题包（例如，Packages/Sites/Foo.Bar）并运行以下命令

composer require noerdisch/neos-slick --no-update

使用 --no-update 命令可防止依赖项自动更新。在将包添加到您的主题 composer.json 之后，返回到 Neos 安装的根目录并运行 composer update。您的所需包现在已正确安装。

使用方法

此包使用背景图片作为幻灯片。如果您想为滑块使用固定高度，可以使用以下 CSS

.slick-slide {
    min-height: <your-slide-height>;
}
.slide__inner {
    height: 100%;
    width: 100%;
    position: absolute;
}

禁用/启用功能

幻灯片和滑块元素有几个混入，您可以通过启用/禁用来添加/删除功能。

示例

如果您想在后台禁用自动播放选项，可以这样做

'Noerdisch.Slick:Content.Slider':
  superTypes:
    'Noerdisch.Slick:Mixin.Autoplay': false

Noerdisch.Slick:Content.Slider 混入

Noerdisch.Slick:Content.Slide 混入

淡入淡出选项

默认情况下禁用淡入淡出选项，因为如果您启用淡入淡出，则显示的幻灯片选项将不起作用。但您可以简单地像这样启用它

'Noerdisch.Slick:Content.Slider':
  superTypes:
    'Noerdisch.Slick:Mixin.Fade': true 
    'Noerdisch.Slick:Mixin.SlidesToShow': false

配置

Noerdisch:
  Slick:
    # include the theme css file form slick
    theme: true
    backend:
      # disables autoplay in backend
      disableAutoplay: true
    # breakpoints for the repsonsive tab
    responsive:
      sm: 576px
      md: 768px
      lg: 992px
      xl: 1200px

贡献

我们非常欢迎您为neos-slick做出贡献。我们尽量让这个过程变得尽可能简单。我们使用semantic-release，以便有更多时间专注于重要的事情，而不是在依赖或发布困境中挣扎。

因此，第一条规则是遵循eslint提交信息指南。这非常简单，当您总是通过yarn commit进行提交时。Commitizen会引导您。

所有PR都将合并到master分支。Travis和semantic-release将检查提交信息，并在分析最新提交触发时开始构建新版本。

如果您有任何问题，请在twitter或github上联系我们。

许可协议

MIT许可协议（MIT）。有关更多信息，请参阅许可文件。