Skip to main content

Drupal 8 教學 - 新增Field與Views filter

Submitted by admin on Sat, 12/21/2019 - 01:12

我們在Drupal 8 教學 - 如何增加側邊欄這篇文章中,增加「最後編輯時間」欄位的段落,學會了如何增加Views頁面所顯示出來的資訊,這邊再做個截至目前為止的簡單的敘述與整理。

我們可以從管理員列表Structure > Views看到所有目前存在的Views物件,也可以在透過這個頁面的「add view」創造新的Views物件。

Views物件可以與page或是block進行Display關聯,稱之為某個views物件的page display或是block display。

在每個Display的管理頁面中,我們可以在Field欄位新增或移除這個Display要顯示的資訊種類。

 

隨著網站的規模擴充,裡面可能有越來越多的文章或是其他內容,管理員列表中Content預設所顯示的資訊可能隨著資訊的更加複雜而不敷使用。

我們可以點開管理員列表的Content (/admin/content),如果沒有做過其他更動,預設的欄位應該僅有Title, Content type,  Author, status與operation。

假設我們透過了pathauto模組來設定每個頁面的url別名,也根據文章的內容加上了個別的tags,一個一個點擊列表中的文章內容才能知道這些資訊是非常耗時費力的。比較有效率的做法是在同一個瀏覽頁面同時呈現出這些資訊。

在這篇範例當中,我們要編輯Display的顯示方式,使我們能夠在同一個頁面底下看到更多的資訊。另外,我們也要增加畫面上方的過濾欄位,根據tags進行篩選,可以讓頁面內容只出現包含所選擇的tags的文章。

等等我們會按步驟進行以下操作:

  1. 在article類別中新增一個屬性為text的Field,使得我們在創建新文章的時候就可以輸入文章的網址別名,作為pathauto這個模組的輸入使用。
  2. 在Content類別的Views Page Display中新增上述欄位的顯示,以及tag的過濾條件。

完成操作後的結果頁面如下圖所示。

result of this example: views add filter

 

1. 在article type中新增一個Field欄位

我們可以在管理員列表Structure > Content type中找到Article類別,點擊對應的Manage Field進到article type的field管理頁面。在這個頁面中點擊「+ Add Field」藍色按鈕來新增一個Field欄位。

drupal article content type add field

點擊按鈕後Drupal會詢問我們要新增加的Field屬於何種資料,這時候先選擇text(plain)。下面的label則是這個新增的field的名稱,先稱呼為URL name或是取一個自己喜歡的名稱也可以,這個欄位只有管理員會看到。

drupal add a plain text field named URL name

按下save and continue後接著要設定這個text(plain)字串的最大長度,以及最多可以附加幾個此種基本元素在這個field上。這邊的字元長度可以按照自己的需求填寫,或是留著預設的255就很夠用了。另外我們預期一個頁面只需要一個url別名,所以Allowed number of values設置為1即可。

完成這個操作後我們可以新增一篇article來測試一下,看看文章上傳頁面是否多了一個url name需要填寫。

如同在Drupal 8 教學 - 新增第一篇文章所提過的,我們可以在Manage Form display的地方調整Field在表單中出現的位置,也可以在Manage Display中對使用者隱藏這個欄位。

如何自動設置網址別名則要在pathauto模組的管理頁面中新增pattern,利用[node:field_url_name]這個token就可以了。更詳細的操作請參考模組頁面。

 

2.在Views page Display中新增顯示欄位以及濾鏡

現在我們來到管理員列表Structure > views頁面中,名為Content的Views物件的Page Display管理頁面(或是經由網址進去,/admin/structure/views/view/content)。在FIELDS欄位中點選Add, 這次我們要新增Content: URL name以及Content: tags兩個元素,新增完畢後的示意圖如下面所示。

drupal views add field to display

如果新增完Display Field後對欄位排列不滿意,可以點擊Add按鈕旁邊的下三角形,有個Rearrange可以調整。

 

接著我們要新增一個濾鏡功能,這個功能在FILTER CRITERIA的欄位中。點選Add後選擇Content: Tags (field_tags),Drupal會詢問我們要下拉式的選單或是自動填入的輸入欄位,以及要分類的tag屬於哪個vocabuliary。在這個欄位我們先選擇Tags就好。

drupal add views tag filter

Drupal中的vocabuliary是分類物件taxonomy的下一層結構,我們可以在管理員列表中Structure > Taxonomy裡面找到所有的vocabulary。這部分會在以後介紹。選擇Tags就好是因為一個node的tag firld底下可能有附加多組來自不同模組的分類標籤,但我們需要的是使用者在建立文章時自行輸入的分類標籤。

點下Apply and continue後請勾選expose this filter to visitors,這樣我們才能夠動態的選擇濾鏡。不用擔心這個選項會出現在一般使用者面前,因為Contents這個頁面的visitors正常而言只有管理員而已。

另外,在Operator的部分我們可以選擇多種過濾條件,例如文章內的tags只要有其中一個符合檢索條件就會出現,或者是需要全部符合才會出現等等。在這裡我們先按照預設的is one of應該就足夠了。

新增filter後的結果看起來應該如下圖。

drupal add expose filter

按下save回到/admin/content管理頁面後應該就能看到新增的行與輸入過濾條件的欄位了。

 

總結

  • Content type頁面
    • 可以新增/移除每一種Content的field。
  • Views Manage Display頁面中的FIELD欄位
    • 可以新增/移除這個views會顯示的field欄位。
    • 可以透過Rearrange重新排列顯示順序
  • Views Manage Display頁面中的FILTER欄位
    • 可以過濾掉不需要出現的content,這個過濾條件可以透過expose this filter to visitors讓外部操作。