[WordPress] 外掛分享: TailPress – Tailwind for WordPress

WordPress 外掛 TailPress – Tailwind for WordPress 的封面圖片。

前言介紹

  • 這款 WordPress 外掛「TailPress – Tailwind for WordPress」是 2022-06-08 上架。
  • 目前有 800 個安裝啟用數。
  • 上一次更新是 2023-04-04,距離現在已有 759 天。超過一年沒更新,安裝要確認版本是否可用。以及後續維護問題!
  • 外掛最低要求 WordPress 5.2 以上版本才可以安裝。
  • 外掛要求網站主機運作至少需要 PHP 版本 7.0 以上。
  • 有 13 人給過評分。
  • 還沒有人在論壇上發問,可能目前使用數不多,還沒有什麼大問題。

外掛協作開發者

freshbrewedweb |

外掛標籤

css | blocks | tailwind | gutenberg | utility classes |

內容簡介

Tailwind CSS 是建立基於區塊的 WordPress 網站的絕佳夥伴。不幸的是,由於它需要使用 Node.js 編譯才能投入實際生產環境,因此在 WordPress 中添加 Tailwind CSS 可能非常複雜。

這個外掛程式通過一個簡單的步驟(啟動外掛程式)將 Tailwind CSS 添加到 WordPress 中,同時處理性能和緩存,使你的網站保持快速和生產環境就緒!

適用對象

這主要針對那些熟悉 Tailwind CSS 並且熟悉使用它的效用類框架來設計其網站的開發人員和使用者。

對於那些想要添加 Tailwind 到工作流程中,而又不想每次頁面內容中的類變化時都不斷編譯 CSS 的人來說,這也是一個非常實用的參考。

工作原理

從頁面中提取類,並在服務器端編譯成 Tailwind CSS
緩存動態生成的 CSS,以避免在生產網站的前端出現性能問題。

您是否與 tailpress.io 主題相關聯?

不,我們不是! 可惜的是,由於巧合,兩個解決方案都使用了相同的名稱,但我們不是相關的,是兩個不同的解決方案。 Tailpress.io 是一個很好的起點,用於開發具有 Tailwind 深度整合的自定義主題。我建議任何想要依賴於 Tailwind 構建自定義主題的開發人員使用它。

Tailpress 此外掛程式作為附加功能為任何項目添加 Tailwind 支持。它可以根據需要使用,添加到自定義主題或現有主題中。

這能用於生產環境嗎?

可以!雖然後端中的樣式是即時生成的,但前端的 CSS 會被緩存到每個頁面。變更頁面上任何類都會自動刷新緩存,以便跟上任何更改。

這能在區塊編輯器外使用嗎?

可以!這將在站點的後端或前端任何使用類來設計的地方都能運作。

已知問題
區塊編輯器中的設備預覽模式

區塊編輯器中的非桌面預覽模式使用了 iframe,無法正常加載資產。因此,在此處無法看到你的 Tailwind 樣式。

頁面緩存

如果站點中有任何頁面緩存,你需要清除緩存以保持最佳體驗。

原文外掛簡介

Tailwind CSS is a great companion to building block based sites in WordPress. Unfortunately, it’s been pretty complicated to add Tailwind CSS to WordPress since it needs to be compiled with Node.js in order to be production ready.
This plugin takes care of that by adding Tailwind CSS to WordPress in one easy step (activate the plugin) and at the same time takes care of performance and caching so your site remains fast and production ready!
Who It’s For
This is primarily for developers and users that are familiar with Tailwind CSS and comfortable styling their site using their utility class framework.
It’s also for those who have struggled to add Tailwind to their workflow without having to constantly compile their CSS every time the classes in their page content changes.
How it Works

Extracts classes from pages and compiles them server-side into Tailwind CSS
Caches the dynamically generated CSS to avoid performance issues on the frontend of your production site.

Are you affiliated with tailpress.io the theme?
No, we are not! Unfortunately the same name was used for both out of coincidence, but we are not affiliated and are two different solutions. Tailpress.io is a great starting point for developing custom themes with deep integration of Tailwind. I would recommend it for any developer that wants to build a custom theme that depends heavily on Tailwind.
Tailpress, this plugin, adds Tailwind support to any project as an add-on. It can be used as much or as little as you need, added to custom themes or pre-existing ones.
Can this be used in production?
Yes! Although the styles in the backend get generated on the fly, the CSS on the frontend gets cached for every page. Changing any classes on the page will bust the cache automatically so it’ll still stay up to date with any changes.
Can this be used outside the block editor?
Yes! This will work anywhere on the backend or front end of your site that uses classes to style things.
Known Issues
Device Preview Mode in Block Editor
The non-desktop preview modes in the block editor utilize an iframe and don’t load assets properly. Therefore your Tailwind styles won’t be visible here.
Page Caching
If you have any page caching on your site, you’ll have to clear your cache for the best experience.

各版本下載點

  • 方法一:點下方版本號的連結下載 ZIP 檔案後,登入網站後台左側選單「外掛」的「安裝外掛」,然後選擇上方的「上傳外掛」,把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
  • 方法二:透過「安裝外掛」的畫面右方搜尋功能,搜尋外掛名稱「TailPress – Tailwind for WordPress」來進行安裝。

(建議使用方法二,確保安裝的版本符合當前運作的 WordPress 環境。


0.1.0 | 0.1.1 | 0.1.2 | 0.2.0 | 0.3.0 | 0.3.1 | 0.3.2 | 0.4.0 | 0.4.1 | 0.4.2 | 0.4.3 | 0.4.4 | trunk |

延伸相關外掛(你可能也想知道)

暫無相關外掛推薦。

文章
Filter
Apply Filters
Mastodon