---
# System prepended metadata

title: '[D8教學]Drupal8超新手入門開發系列-twig'

---

# [D8教學]Drupal8超新手入門開發系列-twig

## 前言
在Drupal8的開發中，twig佔了非常重要的一部份，在D8的版型系統中要呼叫後端的變數、寫HTML、對變數做處理等等都是使用twig，此篇文章先初步介紹新手遇上twig需要注意哪些事情。

## 如何修改twig

在專案開始時會需要設定`settings.php`，若有多人協同開發則還會有`settings.local.php`，若為多人協同開發在`settings.local.php`設定`$settings['twig_debug'] = TRUE;`，即可使用twig修改成指定檔名的twig。
打開開發人員工具可以看到以下twig的提示：
![](https://i.imgur.com/yHA4M4y.png)

  第一個紅框裡面是系統提示的建議修改檔名，越上層影響的範圍越小，以上圖為例，若將檔名修改為`block--views-block--wash-machine-introduce-block-1.html.twig`，則twig只會針對這個名為`wash-machine-introduce-block-1`的views block產生變化，若檔名改成`block--views.html.twig`，只要是views的block都會有影響，所以修改twig的第一個小細節就是檔名選擇，不能隨便亂選，否則會影響他人的程式。
  
  第二個紅框則會告訴你預設的twig是哪個檔案，找到該檔案並複製到專案所使用的theme資料夾內的templates，並修改成第一個紅框提示的檔名，就能開始調整版面啦。
## twig變數
較常需要修改的twig通常跟views及content type有關，會需要修改views所呼叫的變數，或者針對特定content type的文章內頁進行修改，這時也會使用到twig，若是上述兩種，進入twig檔通常會看到`{{ label }} & {{ content }}`，`{{ label }}`是文章內頁的標題，`{{ content }}`是views的所有欄位內容或者文章的內容。
![](https://i.imgur.com/67NfrP4.png)
在我新增的content type中有下圖這些欄位：
![](https://i.imgur.com/0FIn5BF.png)
假設今天我要將列表頁圖片還有摘要顯示出來，就需要呼叫`field_list_img`＆`field_description`，所以看到下圖的twig我呼叫了這兩個變數，由於這些都在`content`的陣列底下，所以使用上會變成{{ content.你呼叫的變數 }}。 
![](https://i.imgur.com/g2cM0zw.png)

## 結語
在Drupal8中對於初學者來說能正確將變數呼叫出來，在正常的版型編排上就足夠了，當然後續還有進階版的twig資料處理及preprocess等更強大更深入的內容，未來將進一步介紹進階版twig實用篇。
