使用 Block X-Ray WordPress 插件查看引擎蓋

過去幾天我最喜歡的工具之一是 塊 X 射線屬性 Sal Ferrarello 的插件。 它面向開發人員並在 WordPress 編輯器中顯示塊屬性。

在周五看到他的推文後,我立即安裝了它。

該插件目前只能通過其 GitHub 存儲庫獲得,任何想要試用它的人都可以從 1.0.0 發布頁面.

Ferrarello 和他的同事們有一整天的公司時間來回饋社會。 WebDevStudios 的員工 始終如一地奉獻 每個月一天到 未來之五,這是一項鼓勵組織將 5% 的資源貢獻給 WordPress 項目的倡議。

該公司的 未來的前五天 2022年的上周五降落。 Ferrarello 選擇構建一個插件,該插件可能對其他正在構建塊的開發人員非常有幫助。

Block X-ray Attributes 在編輯器的 Post 側邊欄面板下添加了一個名為「Block X-ray」的新選項卡。 它只是以 JSON 格式顯示具有當前選定塊屬性的代碼欄位。

使用 Block X-Ray-wordpress-plugin 查看引擎蓋下的塊 X-Ray WordPress 插件查看 Columns 塊的屬性。

當我第一次安裝插件時,我希望該選項卡位於「塊」面板下。 由於屬性是特定於塊的,所以它會在那裡是有道理的。 它位於「發布」或「頁面」面板下,具體取決於您正在編輯的內容類型。

我希望看到的一個缺失功能​​是複製按鈕。 對於嵌套塊,用滑鼠複製輸出可能會很長,並且在我的代碼編輯器中快速抓取並粘貼它可以節省我的一些精力。

我想其他開發人員會發現該插件在構建新塊時快速查看屬性非常寶貴。 這也是我的主要用例,所以我插入了一個我需要在某個時候完成的麵包屑插件:

look-under-the-hood-with-the-block-x-ray-wordpress-plugin-1 使用 Block X-Ray WordPress 插件查看引擎蓋下測試塊的自定義屬性。

能夠快速查看我的塊的自定義屬性使我能夠查看我需要了解的關於它們的所有信息。 當我打開和關閉選項時,我可以注意到這些值是否正在添加和正確。

另一個用例是出現可怕的無效塊錯誤時可用的大量信息。

look-under-the-hood-with-the-block-x-ray-wordpress-plugin-2 使用 Block X-Ray WordPress 插件查看引擎蓋下深入研究塊驗證問題。

如果我想測試一個功能,那就是它。 有時 WordPress 似乎無緣無故地在自定義模式中隨機給我一個塊驗證錯誤。 也許它是雜散的空白或其他一些看不見的鬼魂在它下面四處遊盪。 塊恢複選項沒有幫助。 因此,我將保留 Block X-ray Attributes 的安裝狀態,直到我最終能夠捕捉到其中一個奇怪的隨機病例。 會有幫助嗎? 我們會及時看到的。

現在,我建議任何開發與塊相關的東西來安裝和激活這個插件的人。 這是一個方便的工具,可以減輕一兩個頭痛。

來源

相關文章