在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>'; } 

我之所以在一個代碼塊中實現它，是因為很容易將代碼塊添加到所需的任何頁面中，並且可以拖動它們顯示的順序。

這是一個非常高級的答案。 如果您需要更多詳細的支持，或者您覺得不清楚，那么我很樂意提供進一步的幫助。 這里沒有足夠的空間來詳細說明每個實施步驟，但是您需要提供指南。

當我的Slider模塊完成時（它會比人們苦苦掙扎的現有jssor模塊容易使用得多），我很樂意為您提供早期的副本。

Answer 2

視圖幻燈片可用於創建可顯示在視圖中的任何內容（不僅僅是圖像）的幻燈片。 它由jQuery提供支持，可高度自定義：您可以為創建的每個視圖選擇幻燈片設置。

• 請遵循標准的Drupal 8模塊安裝說明 。

  視圖幻燈片還需要一些外部JavaScript庫。 有關詳細信息和安裝說明，請參見自述文件。 或者，如果您通過drush安裝，則將自動安裝它們。 如果不安裝庫，則“視圖幻燈片”將不起作用！