Orca Admin 表格區塊教學|拖拉儲存格邊界調整欄寬 - 虎鯨數位行銷 OrcaBiz SEO|AI SEO公司
牙醫診所全台突破7000+,了解如何佈局GEO / AIO 了解更多 牙醫小幫手WordPress專屬站內預約外掛 了解更多 Vibe 網站助理|用 AI 對話管理 WordPress 網站 了解更多

Orca Admin 表格區塊教學|拖拉儲存格邊界調整欄寬

507 瀏覽
2026-10-24 更新

WordPress 內建的「表格」區塊,欄寬一直是平均分配:內容短的欄位佔了一大塊,內容長的欄位卻被擠成一直條。安裝 Orca Admin 之後,表格區塊多了一個功能:直接用滑鼠拖拉儲存格邊界,就能調整每一欄的寬度,不用寫 CSS,也不用裝額外的表格外掛。

這篇用一個三欄的方案比較表,示範從拖拉、確認欄寬到前台呈現的完整流程。

1 先插入一個表格區塊

在文章或頁面的編輯畫面新增「表格」區塊,設定好欄數與列數、填入內容。剛建立的表格,每一欄寬度都一樣。

剛建立的三欄表格,每欄寬度相同
預設的表格,三欄平均分配

2 游標移到儲存格邊界

把游標移到兩個儲存格中間的線上(左右各約 6 px 的範圍都有感應),游標會變成左右雙向箭頭,代表這條邊界可以拖拉。上圖紅線標示的位置,就是第一欄與第二欄之間的邊界。

游標移到第一欄與第二欄的邊界,紅線標出可拖拉位置
游標停在邊界上,會變成雙向箭頭

3 按住滑鼠左鍵拖拉

按住左鍵不放,往左或往右拖。被拖的這條邊界,只會影響左右相鄰的兩欄:一欄變窄,另一欄就變寬,其他欄位的寬度不動,整張表格的總寬度也不變。

拖拉第一欄邊界時,第一欄變窄、第二欄變寬
往左拖:「方案」欄變窄,「適用對象」欄變寬

依序拖拉其他邊界,把每一欄調到想要的寬度。下圖是把「方案」縮窄、再把「月費」縮窄之後的樣子,文字比較長的「適用對象」得到最多空間。

調整完成後,三欄各自有適合內容的寬度
依內容長短調整後的欄寬

拖拉時的小提醒

  • 每一欄最窄只能到 24 px,再往內拖就不會繼續縮了。
  • 欄寬是在放開滑鼠的那一刻才寫入。拖一次就是一個復原步驟,拖壞了按 Ctrl+Z(Mac 為 Cmd+Z)就能回到上一個寬度。
  • 拖拉後,區塊的「固定寬度的表格儲存格」會自動開啟,不用另外設定。

4 在側邊欄確認欄寬數值

選取表格區塊,打開右側「區塊」分頁,展開「欄寬」面板,會列出每一欄目前佔整張表格的百分比。想要完全一樣的寬度比例,可以對照這些數字再微調。

要恢復成平均分配,按面板裡的「重設欄寬」即可。

區塊設定側邊欄的欄寬面板,列出各欄百分比與重設欄寬按鈕
「欄寬」面板顯示各欄百分比,並提供「重設欄寬」

5 前台的呈現

更新文章後,前台的表格就會照你調好的欄寬顯示。欄寬是用百分比儲存,所以不論在電腦、平板或手機上,各欄的比例都維持一致。

前台表格依拖拉設定的欄寬顯示
前台依設定的欄寬顯示

注意事項

  • 新增或刪除欄位後,要重新拖拉。欄寬是依欄數記錄的,欄數一變,原本的設定就會失效,表格自動回到平均分配,「欄寬」面板也會提示「欄數已變更,原欄寬已失效」。新增列不受影響。
  • 只改欄寬,不動表格內容。欄寬存在區塊的設定裡,儲存格的 HTML 不會被改動,停用 Orca Admin 後表格內容依然完整,只是欄寬會恢復成預設。
  • 手機版面:欄寬是百分比,內容很長的欄位在小螢幕上會自動換行,建議欄數不要超過 4 欄。

常見問題

Q1:游標移到邊界沒有變成雙向箭頭?

A:請確認 Orca Admin 外掛已啟用並更新到最新版,更新後重新整理編輯畫面。游標要正好落在兩個儲存格之間的線上,離線太遠不會有感應。

Q2:編輯畫面調好了,前台卻沒變?

A:先確認文章已按「更新」。若站台有開快取(例如 WP Rocket、Cloudflare),請到後台清除快取後再看前台。

Q3:可以讓某一列的儲存格有不同寬度嗎?

A:不行。表格的欄寬是整欄一起套用,同一欄的每個儲存格寬度一定相同,這也是 HTML 表格本身的規則。

▧ 文章分類

▧ 熱門文章

✦ 虎鯨 OrcaBiz SEO 優化專業團隊 ✦

幫助你將流量累積成看得見的業績,成為長期有效的最強業務!

Picture of OrcaBiz SEO 顧問
OrcaBiz SEO 顧問

虎鯨數位行銷 OrcaBiz 是台灣具備十年以上 SEO 優化經驗的公司,服務單位包含上市櫃公司、B2B 跨境外銷及中小企業,團隊成員包含技術型 Technical SEO、文案型 Content SEO,讓你在執行 SEO 上能完整擁有自己的數位資產,獲得品牌拓展最堅實的後援團隊!

SEO 專欄
SEO