給新手看的 Ninja Tables Pro 教學: 地表最強整合資料表格WordPress外掛

Last Updated on 2022 年 1 月 4 日

不知道你是否遇到一種情況，那就是辛苦做好的精美表格，在不同裝置(手機、平板或電腦)裡顯示卻跑框、不對齊了!

Ninja Tables Pro 教學 讓你快速了解最通用的 WordPress 響應式表格外掛，手把手教你使用Ninja Tables 的各種強大功能，與跑框不對齊的表格說掰掰。

Ninja Tables 在WordPress外掛評分中擁有4.5顆星(滿分五顆星)的高分，並超過六萬次的啟用安裝數。

假如你有大量的WooCommerce產品列表，像是Amazon電商網站的話，那麼非常推薦你使用 Ninja Tables Pro。

為什麼? 讓我們繼續看下去!

Ninja Tables 介紹&特色

WordPress 中最簡單的響應式表格外掛

通過快速建立響應式表格，可以在你的網站上顯示大量數據資料，也可以響應任何設備(電腦或手機、平板)的寬度。

Ninja Tables 有一個很棒的功能，可以使用 Footables、Bootstrap 3 & 4 和 Semantic UI 來設計表格的前端。

超過 100 種表格樣式

提供百種不同樣式、五顏六色的表格模板。

表格加載速度快

Ninja Tables 從一個頁面開始操作所有內容。 VueJS 和 VueRouter 作為單頁應用程序 (SPA) 用於開發後端，使體驗更加流暢，包括製作表格以設置配置、插入條目、導入 CSV 文件和重新排列列。

友善且簡易操作的介面

表格列的設計和響應式斷點的配置使重新排列列(column)變得更加容易。

手機響應式應表格

在所有類型的設備中加載表非常重要。 Ninja Tables 通過在行內的可擴展區域中添加這些列來解決這個問題。

你可以輕鬆操縱哪些列將顯示在哪些設備中。 Ninja Tables 包括在所有設備上運行的實時排序、分頁和搜索功能。

匯出(Export)和匯入(Import)數據

表格可以以 CSV / JSON 文件格式匯出/匯入存檔使用。

從其他表格外掛匯入

如果你已經在使用其他表格外掛(例:TablePress)，你其實也可以簡單地匯入數據表格。

短代碼

只要將製作完成的表格的短代碼複製貼上到WordPress網站頁面或文章中，可以看到表格呈現在想要的位置。

客服支援

免費且提供優秀服務的客服團隊。

Ninja Tables 安裝&設定

登入你的WordPress網站後台 > [ 外掛 ] > 新增外掛 > 搜尋 [ Ninja tables ] > 安裝外掛。

接著，會看到Ninja tables外掛已經安裝好，按下 [啟用]。

Ninja Tables Pro 教學 – 開始製作第一張表格

STEP 1:

進到Ninja Table的操控畫面，按下右上角的藍色按鈕 [Add Table]。(假如你已經有作好的表格，可以直接點 [Import Table] 。)

會跳出以下編輯視窗，在[ Table Title ]命名此表格，你也可以在 [Table Description]加入描述。

右手邊的箭頭小圖示可以匯入已建立好的表格(CSV、JSON檔)。

也可以跟WP Fluent Form整合。

假如需要更多功能，像是與 Google Sheets整合、移除CSV或是客製化SQL，則需要升級到Pro版。

STEP 2 :

點 [Add Column]，開始製作你的列(Column)。

[Basic Settings] 設定列名，也可以決定是要以文字形式、數字、日期、按鈕或是圖片/連結的形式呈現。

也可以決定表格欲顯式的裝置設備，例如:可以顯示在電腦上但不顯示在手機上，或對全部設備隱藏/顯示表格等。

Ninja Table Pro 可以客製化表格寬度、內容位置和背景顏色等。

基本上，只要你點進欄位就可以立刻編輯，非常方便，也可以按右邊的 [Duplicate data]小圖示複製單筆資料。

簡單兩步驟就可以完成一個表格。

Ninja Tables Pro 進階功能說明

[ Table Configuration ] 裡的 [Columns] 可以用拖拉的方式設定列的順序。

[ Rendering Settings ] 有Ajax Table和 Advanced Table (legacy)的選擇，通常免費版只能用Ajax table。

如果你對進階功能有需求和講求更好的SEO的話，就可以考慮使用 Advanced Table (legacy)。

[ Custom Filters ] 升級Pro版才能用的篩選(Filters)功能。

[ Table Design ] 預覽各設備(手機、平板、電腦)的顯示位置和形式，也可設計表格外觀、顏色等。一樣要升級才能使用全部的功能。

會CSS的站長也可以在 [Custom CSS/JS] 編輯存檔。

[ Frontend Editing ]能讓前端使用者根據使用者角色新增、編輯和移除紀錄。

Ninja Tables 方案比較

方案大同小異，只差在可使用網站數，而且阿，假若購買後不滿意還可以在14天內要求全額退款。

結語

表格外掛適用於各種WordPress網站，但你若是經營WooCommerce之類的電商網站或是自己接案的話，常常需要製作大量的產品表格說明，這時候Ninja Tables就非常適合你了。

需特別注意的是，假如你用了免費版的Ninja Table之後想升級成Pro版，記得不要刪除Ninja Table外掛，不然沒辦法使用Pro版阿。