在Drupal 8中创建自定义滑块

Question

我目前参与了Drupal 8项目，但我对Drupal很新。简而言之，该项目的目的是建立一个基于现有设计的网站，客户可以更新Drupal中的网站（如修改一些文章，将图像上传到图库，将幻灯片添加到滑块等）

我已经有了一个静态的html页面。

此时，我设置目标以将静态页面的滑块移动到Drupal，以便用户可以添加，删除或更新幻灯片。每张幻灯片都包含背景图片，标题和说明文字。

经过一天的研究，我现在可以创建自己的主题并创建一个“硬代码”首页，这与我的静态html页面完全相同。我很难将幻灯片转换为用户可以在Drupal中修改的通用项目。

我正在阅读一些关于模块和视图的文章，但感觉非常迷失。

我能否就主题的哪些方面或我应该采用哪些技术来实现我提到的目标有一些指示？谢谢！

Answer 1

我目前正在开发一个Drupal 8模块，它实现了一个带滑块的块。编辑滑块非常容易。它使用Jssor滑块。

你的工作时间是什么时候？我愿意帮助你。

1. 下载Jssor滑块（非jQuery /非最小化/全宽版本）
2. 在新的自定义模块中编码您自己的滑块。将Jssor HTML放在滑块代码的一部分中，该代码输出块的HTML
3. 通过Drupal控制面板创建Slider内容类型（内容类型需要包含多个图像，以及您要显示的任何其他幻灯片信息） - 这是最终CMS用户将添加和删除图像/文本的位置对于滑块（它们不需要更改块）。

4. 滑块的代码应该读取滑块内容类型中选择的图像，并在Jssor HTML中输出这些图像的HTML。类似的东西：

   $slider_html = '';
   foreach ($full_image_urls as $full_image_url)
   {
     $slide_html .= '<div><img data-u="image" src="'. $full_image_url .'" /></div>';
   }
   

我在一个块中实现它的原因是因为块很容易添加到你喜欢的任何页面，你可以拖动它们显示的顺序。

这是一个非常高级的答案。如果您需要更详细的支持，或者您觉得这不清楚，那么我很乐意进一步提供帮助。在这里的答案中，没有空间详细说明每一步的实施，但是你要求提供指南。

当我的滑块模块完成时（它将比人们挣扎的现有jssor模块更容易使用），我很乐意为您提供早期副本。

Answer 2

视图幻灯片可用于创建可显示在视图中的任何内容（不仅仅是图像）的幻灯片。由jQuery提供支持，它可以进行大量自定义：您可以为您创建的每个视图选择幻灯片设置。

• 遵循标准Drupal 8 module installation instructions。

  视图幻灯片还需要一些外部JavaScript库。有关详细信息和安装说明，请参阅自述文件。或者，如果您通过drush安装，它们将自动安装。如果您不安装库，则视图幻灯片将无效！