用drupal8自定義區(qū)域（3）——用自定義動態(tài)區(qū)塊仿制頁面

時間：2023-04-21 03:51:02 | 來源：網(wǎng)站運營

時間：2023-04-21 03:51:02 來源：網(wǎng)站運營

用drupal8自定義區(qū)域（3）——用自定義動態(tài)區(qū)塊仿制頁面：動態(tài)內容的仿制基本流程如下：定義內容類型-->輸入節(jié)點內容-->定義視圖區(qū)塊-->定義視圖模板-->定義字段輸出-->放置視圖區(qū)塊，涉及內容類型、視圖、區(qū)塊布局3個模塊的處理，具體操作過程如下：

一、創(chuàng)建內容類型

1.依次點擊“管理/內容類型/添加內容類型”，在彈出的窗口中填寫對應參數(shù)，機讀名稱為slidershow，需要注意的是，內容類型的“機讀名稱”要與視圖區(qū)塊的“機讀名稱”相同。然后，點擊“保存和管理字段”；

2.刪除body字段；

3.根據(jù)前端需求添加圖片類型、純文本、長文本類型字段；如果是鏈接字段，添加文本類型的即可。

4.然后點擊“保存”。

說明：這個操作，主要是創(chuàng)建與管理內容的字段與顯示設置，為視圖的管理提供內容字段。

二、添加節(jié)點內容

1.依次點擊“內容/添加內容/輪播圖片”，在彈出的界面中填寫“內容類型”定義的每個字段；

2.添加完畢，點擊“保存”。

三、創(chuàng)建視頻區(qū)塊

1.依次點擊“管理/結構/視圖/添加視圖”，在彈出的界面中填寫相應參數(shù)，機讀名稱為slidershow，其中視圖名稱的“機讀名稱”要與對應內容類型的機讀名稱保持一致；要勾選“生成一個區(qū)塊”；

2.點擊“保存并編輯”，在彈出的界面中添加內容類型定義的5個字段，并設置該5個字段“排它顯示”；

3.添加“定制文本”字段，用來自定義文本或者鏈接，即動態(tài)輸出的代碼段從前端剪切到這個地方，然后用自定義的字段替換對應輸出內容，故而參數(shù)不能設置“排它顯示”。

四、覆寫視頻模塊

1.在/drupal8/themes/mytheme/templates/views文件夾新建views-view-unformatted--slidershow--block-1.html.twig文件；

備注：slidershow為視圖的機讀名稱，block-1為區(qū)塊的機讀名稱；視圖名稱與機讀名稱是可以不一樣的，例如，視圖名稱為中醫(yī)師承(可自定義，案例中是輪播圖片區(qū)塊)，機讀名稱為slidershow如下圖：

2.復制樣式代碼到views-view-unformatted--slidershow--block-1.html.twig并添加{{ rows }}變量；

3.需要注意views-view-unformatted--slidershow--block-1.html.twig中樣式代碼div的開始與結束，要有始有終。

五、修改視圖字段輸出

1.把views-view-unformatted--slidershow--block-1.html.twig模板文件中rows對應的前端動態(tài)輸出代碼剪切到“定制文本”字段內；譬如，把長文本“Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts.”替換成{{ field_lang_text }}，等等，如下圖：

2.用“內容類型”自定義的字段替換要輸出的內容。

備注：這個地方實際是就是循環(huán)輸出內容，可以設置輸出的頁碼，即輸出幾條。

3.如果前端輸出的圖片大小不受控制，可以點擊“管理/配置/圖像樣式”，添加1個自定義的圖片樣式；然后，在視圖對應的圖片字段應用該定義的圖片模式；保存并刷新前端頁面，圖片大小改變。

六、添加視圖區(qū)塊到對應區(qū)域

1.依次點擊“管理/結構/區(qū)塊布局”；

2.在彈出的界面中，找到自定義的區(qū)域“證明”，點擊“放置區(qū)塊”，把剛剛定義的視圖區(qū)塊放置到“證明區(qū)域”，清空緩存，保存并刷新前端頁面，動態(tài)輪播效果制作完畢。