Panels 2.X 教學 (基礎應用篇)

更新日期 : 2008-12-14 19:00

大家好! 以下是簡單的Panels 2教學。
我將教學分為四部分 (A, B, C, D), 每一部分都附圖片, 看文字外亦請留意圖片內容 (想讓大家看清楚點, 圖片較大, 抱歉!!)

在示範中, 我使用了:
Drupal 5.14
Panels 5.x-2.0-rc1a

*此教學的理論適用於Panel 2.x 任何版本
*由於Panels不穩定, 如果你使用的版本不一樣, 效果可能會有差別
*Drupal 6中, 你會發現錯誤, 或者找不到我提及的東西

教學內容:
A. 建立最簡單的Panels頁面
B. 應用ConTEXT Arguments的Panels
C. 在不同的Content type顯示不一樣的內容
D. 限制只在某些Content type應用Panels

在教程示範中, 沒有提及的設定, 直接略過就可以

A. 建立最簡單的Panels頁面

在這部分, 你會學到建立最簡單的Panles頁面

1. 增加一個Two column Panel
圖 1

1-1. 瀏覽"?q=example", 你應該看見空白頁面
圖 1-1

1-2. 在CONTENT隨便增加一些東西
圖 1-2

1-3. 再瀏覽"?q=example", 你應該看見增加的內容了
圖 1-3

以上就是最簡單的自定頁面。

B. 應用ConTEXT Arguments的Panels

你會學到如何應用ConTEXT中的Arguments, 這是令Panels達到Panels everywhere的第一步及重要的一步

2. 增加一個Two column Panel. Path設定是: node/%
圖 2

2-1. ConTEXT增加Arguments-> Node ID
圖 2-1

2-2. 在Content, 增加Node content 欄下的 Node content
圖 2-2

2-3. 再增加一個Custom欄下的Node content
圖 2-3

在這裏, 請大家特別注意, Node content 及Custom 欄下都有Node content, 但兩者是有不同分別的 !!
2-4. 你可以清楚看見, 左面是根據URL決定顯示什麼內容. 而右面是在上一步中指定的Node ID內容
圖 2-4

2-5. 現在, 我們回到ConTEXT中增加一個Arguments-> Node add form
圖 2-5

2-6. 再回到Content, 當你增加東西時, 你會發時多了Form一欄, 我們如圖增加一個General Form
圖 2-6

2-7. 瀏覽"?q=node/1"看看, 怎麼了 !! 那不是ADD FORM !!!
圖 2-7

2-8. 對!! 因為我們瀏覽了錯誤的URL, 正確應該是"?q=node/1/page", "?q=node/1/story".
圖 2-8
(抱歉, 這張圖片我截了"?q=node/2/page", 所以add form上的內容跟圖 2-7有差別)

聰明的你當然發現了:
Node ID: 在URL中就是node的id
Node add form: 就是Content type

TIPS:
- Setting中的Path: node/%
"?q=node/1/page" = "?q=node/Argument 1/Argument 2"

- Setting中的Path: node/
"?q=node/1/page" = "?q=node/Argument 1/Argument 2"

- Setting中的Path: node/%/sth/%
"?q=node/Argument 1/sth/Argument 2"

至於conTEXT中的Contexts是什麼 ?
我想亦不用像上面這樣說了. 就是設置指定的東西, 而非跟隨URL而變化.

2-9. 好了, 到現在你會發現瀏覽"node/1", "node/2"... 標題都一樣的 !!
怎麼解決 ??
其實很簡單, 我們可以在title輸入 "%node"

是不是解決了 ? 但我還知道你們會問: %node是怎麼來的?
其實就是KEYWORD, 看圖
圖 2-9

C. 在不同的Content type顯示不一樣的內容

3. 回到conTEXT, 如圖設定
圖 3

3-1. 現在你會在Layout 及 Content 中看見圖中畫上直線的選項, 隨意設定, 就能做到不同的Content type有不同的顯示
圖 3-1

D. 限制只在某些Content type應用Panels

4. 回到conTEXT, 如圖設定
圖 4
現在你會發現只有content tpye 是page的node才會執行Panels

Kay. L
2008-12-14.
https://drupaltaiwan.org/node/2876
(我會更新及修正, 請轉貼的朋友保留連結)

如果反應熱烈, 我會製成PDF / PPT 等格式, 這更加方便閱讀。