iT邦幫忙

2021 iThome 鐵人賽

DAY 23
0
自我挑戰組

真,從零建置個人網站 30 天領域展開系列 第 23

【領域展開 23 式】 Page & Post ,雙 P 關係確認

  • 分享至 

  • xImage
  •  

Page & Post 傻傻分不清楚

由於前兩天在研究 Menu,發現設定 Menu 的時候可以有 Page 跟 Post 兩種 items 都可以拉成導覽列的選項,今天來研究這兩者的差異與會打算怎麼使用

大家好,我是 Jade Chang
Statistic Information 畢業,入職場後於外商從事軟體技術行銷,長期規劃各種線上線下活動像是直播節目/帶狀線上教學,後期負責學生實習計畫與大專院校 Talent Cultivation 與技術社群行銷 Program 為主,過去一年轉任於台灣本土軟體開發商 PM,周旋於客戶、工程師與設計師之間並短期投身新創事業,近期轉換於新竹半導體產業,還在體驗適應中。


首先,導覽 Page 頁面

Page 顧名思義代表頁面,每一個網站都是不同頁面所組合起來的網站,所謂的頁面就會有單獨屬於自己的 URL,舉例iT邦幫忙來說,可以看到導覽列中有技術問答聊天室兩的 page,這兩個 page 樣式不同且各自有不同的 url 分別為 questiontalks,不同但可被取名方便使用者記憶與搜尋

通常 Page 頁面在一般個人網站中會應用於關於我工作經歷聯絡我等靜態頁面,他更新的頻率不會是每天或是每週或是非常固定的時間,多半會像是用為單位,像是換工作,也都會是純粹文字與幾張圖片為主,聯絡我也多半是設定完成後久久才會更新一次 (電話與 email 沒事也不會常常更換)

那一起來看 WordPress 中的 Page,位置:WordPress 後台 > Page > all pages
可以看到 all pages 的頁面列表可以用發布時間SEO分數Readability 可讀性分數來做篩選,這幾個數值都 YaostSEO 套件協助網站排名的指標,明天的文章會再詳細介紹

接下來,新增一個 Pages,點下新增後就會進到頁面編輯器,這是直接使用 WordPress 提供的 Gutenberg 編輯器,簡單介紹可參考【領域展開 19 式】初次使用 Elementor 編輯頁面最後一段,簡單在頁面使用 Paragraph + image 做了有 call to action 的 banner,這樣一個 page 就完成囉!

再來,導覽 Post 文章

Post 顧名思義代表文章,通常會使用於多頻率發布的時候使用,包含像是知識性部落格旅遊部落格美食部落格等整個網站以純文字與多圖片為導向的網站,會需要有文章分類的需求,可以直接看 WordPress 後台的 Post 列表,明顯看到比起 Page 更多了 Category 分類Tags標籤

說明 Category 分類,以剛剛提到的美食部落格為例,假設有五篇文章,分別為(以下皆為虛構):

  1. 台北東門驕傲鼎泰豐
  2. 西屯必吃茶六燒肉
  3. 一生要吃一次屋馬燒肉
  4. 廟口營養三明治
  5. 海邊漫吃巴莎諾瓦餐廳

假設今天使用者是預計要去台中玩的朋友,上到這個美食部落格的目的是要搜尋台中好吃的食物,那他來說除了西屯必吃茶六燒肉一生要吃一次屋馬燒肉之外其他文章都是非必要知道的資訊,如何讓使用者即時找到需要的資訊呢?就是將眾多的文章坐再一層的分類,將文章分為以下:

  1. 台北 > 東門驕傲鼎泰豐
  2. 台中 > 西屯必吃茶六燒肉
  3. 台中 > 一生要吃一次屋馬燒肉
  4. 基隆 > 廟口營養三明治
  5. 墾丁 > 海邊漫吃巴莎諾瓦餐廳

在眾多篇文章中設計邏輯分門別類,上述舉例終究是多加上地區 的分類,這樣使用者進到美食部落格時可以有目標性的點選台中分類,看到符合期待的搜尋結果,增加網站停留時間與再次回訪的機會

簡單新增一個文章,位置:WordPress 後台 > Post > add new
可以看到編輯處多了一塊 Category 可以勾選,相對的在 po 出去的文章上就會顯示勾選的Category 分類

最後,預計個人網站如何使用 Page & Post

【領域展開 21 式】 Menu 修煉持續進行中有提到目前的網站架構與內容規劃,如果照今天學習理解,除了 blog 的裡面會使用到眾多的 post 之外,其他頁面相較之下都不會這麼頻繁更新,只是 blog 初期可能也是單篇單篇文章,分類的使用還是要累積相關作品才能發揮分類的最終作用

One more thing..

鐵人賽文章會 Delay 1-2 天同步放在 Medium
歡迎訂閱或是透過 Facebook 一起來交流 (求指導)/images/emoticon/emoticon32.gif

https://ithelp.ithome.com.tw/upload/images/20200915/20094570oG1ujl6HbX.png


上一篇
【領域展開 22 式】 初次認識 Jetpack 與啟用
下一篇
【領域展開 24 式】 WordPress 外掛目錄中排名第一的 YoastSEO
系列文
真,從零建置個人網站 30 天領域展開30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言