基本網格：詳細概述和審查

ThemePunch 為 WordPress 製作了一些最受歡迎的插件。 Essential Grid 是他們圖書館中收入最高的人之一，與 Slider Revolution 並駕齊驅。 隨著時間的推移，Essential Grid 已成為 CodeCanyon 上最受歡迎和最成功的插件之一。 所以我們想給這個插件一個亮點，讓你們決定它是否可以改善你的網站。

基本網格

網格插件並不少見。 事實上，我們自己的 Divi builder 有一個 Portfolio 模塊可以達到這個目的。 但是 Essential Grid 遠遠超出了大多數其他網格插件所做的，這就是為什麼即使在許多主題都包含他們自己的自定義網格模板之後，人們仍然每天都在購買 EG 許可證。

簡單地使用原始的銷售簡介會告訴你你可以用 EG 做什麼：

Essential Grid Gallery 是 WordPress 的高級插件，允許您在高度可定制的畫廊網格中顯示各種內容格式。 可能的應用範圍包括作品集、博客、畫廊、WooCommerce 商店、價格表、服務、產品滑塊、Instagram、YouTube、推薦書以及您可以想像的任何其他內容。

但他們的宣傳並沒有告訴你的是所有定制所包含的內容。 這是我們的工作，我們打算這樣做。 所以讓我們深入研究一下，看看有什麼大驚小怪的。

入門

首先，請記住這是一個高級插件。 您需要前往 CodeCanyon 並以 27 美元的價格下載。 然後完成手動安裝過程（插件 - 添加新 - 上傳）。 此時，您的 WordPress 管理儀表板中將有 3 個新項目： Ess。 Grid 、 Punch Fonts和Ess。 網格示例帖子。 首先，讓我們看看簡單的Ess。 網格。

第一個菜單項是您輸入激活碼、檢查更新、更改日誌之類的地方。 他們確實提供了一些關於如何使用插件的簡單說明，歸結為：使用短代碼或將小部件拖動到側邊欄。

此頁面也將是您創建要使用的任何新網格的地方，因此請習慣單擊該按鈕。

物品皮膚編輯器

在Item Skin Editor 下，您擁有 Essential Grid 附帶的所有基本模板。 您可以逐個皮膚地編輯這些內容，更改您想要的任何內容。 或者按原樣使用它。 您甚至可以從頭開始創建自己的。

在這裡，EG 為您提供了通過選項卡對不同類型的網格項目進行排序的選項。 （甚至間距、砌體設計、帖子或 WooCommerce 產品網格。）當您將鼠標懸停在每個網格上時，它會以動畫方式顯示標題、摘錄、顏色疊加等，您可以通過單擊綠色齒輪圖標進行自定義。

在此選項面板中，可以編輯每個元素。 從元素之間的間距、顯示的圖標、動畫風格和持續時間、鏈接、陰影、媒體類型和適合度，一切。

我想提醒您注意，Essential Grid 在普通視圖中提供了 CSS 類，您可以隨意操作。 如果由於某種原因在此處的選項中找不到完美的設計選項，您可以通過自定義 CSS 自行添加。

在頁面底部，您可以鳥瞰您可以訪問的每個圖層以及它當前的樣式。

元數據和搜索設置

皮膚編輯器可能是 Essential Grid 中最強大的獨立部分，但 EG 不會在其他地方迴避這些選項。 您可以在Meta Data Handling下創建自定義元框，這使您可以選擇為插件中可能需要的自定義功能放置框。

您可以在Search Settings下做幾乎相同的事情，但用於（您猜對了）搜索。 EG 也可用作搜索結果頁面，因此如果您對正常存檔的方式和外觀不滿意，這是快速修復它們的好方法。

全局設置

就像聽起來一樣，全局設置涵蓋了您的所有基礎。 您可以為誰可以更改和編輯網格、字體和 JavaScript 加載方式、您為緩存做什麼、從何處獲取圖標、為網格元素設置默認圖像等設置權限。 如果它適用於整個插件而不是單個元素，例如僅皮膚，您將能夠在此處找到它。 令人印象深刻的部分是您獲得的控制權——許多插件並沒有為您提供選擇使用哪種查詢的選項，但 EG 讓您選擇get_posts()或WP_Query() 是否最適合您的網站（如果您不這樣做）不知道那是什麼意思，就讓它默認吧。這樣就好了。

進出口

當您第一次設置插件時，您一定要查看導入/導出頁面。 如果您單擊“導入完整演示數據”和“導入社交媒體演示網格” ，您將擁有大量可以開始使用的初始模板。 它們也很好，所以只需單擊按鈕，導入/下載幾乎是即時的。

當您導航回Ess時，導入的網格將出現在列表底部。 網格。 您的新網格庫將在那裡與您會面。

埃斯。 網格示例帖子

第二個新的管理菜單選項是Ess。 網格示例帖子。 為菜單標題做一個奇怪的選擇，因為這是您的模板化網格項目可能存在的地方。 您會看到，此頁面上列出的所有帖子實際上都是Ess下網格中包含的框的內容。 網格概覽。

當您在要顯示網格的任何帖子或頁面中使用從概覽頁面獲得的短代碼時，這些是彈出的單個項目。

為新網格創建帖子也很容易。 它的工作原理就像添加任何其他類型的新帖子一樣。 只需點擊此標題下的添加新按鈕並設置參數。

使用保存的基本網格

無論您是使用模板還是自己製作模板，您都需要知道如何使用它們。 一切都圍繞著 Essential Grid 的短代碼。 如果您有一個想要反複使用的特定網格，則需要單擊Ess下的Create New Ess Grid 。 管理面板中Grid的概覽頁面。 在裡面，你可以從如何對網格中的項目進行排序、它具有什麼加載動畫、它的元素實際來自哪裡等方面進行選擇，然後你就可以給它命名了。

命名時，您還可以選擇其短代碼別名。 該別名僅用於使用 Essential Grid 短代碼調用此特定網格。 我還選擇對 CSS ID 使用相同的 ID，以防將來我想進行外部調整。

接下來只需將短代碼放在帖子或頁面的文本編輯器中。

瞧！

使用獨一無二的基本網格

如果你知道你只需要在一個頁面或一個帖子中顯示一些東西，可能沒有任何理由去設置一個全新的網格，為其內容製作新帖子作為模板，以及製作別名等等那。 您可以簡單地從帖子編輯器本身生成動態短代碼。 只需按下工具欄中的Essential Grid Shortcode Creator按鈕。

然後，您將需要通過這些步驟來告訴此短代碼您希望它呈現什麼內容。 您可以從概覽菜單中選擇一種預定義的（無需手動複製/粘貼其短代碼），或者您可以根據顯示的選項製作自己的短代碼。

您將瀏覽頁面以選擇您在其他地方擁有的所有相同選項（動畫、佈局等），當您準備好開始時，按下“生成簡碼”按鈕。

如您所見，動態生成的簡碼要復雜得多，因為它包含有關網格本身的所有信息。

但是當它被渲染時，沒有區別。 特別是如果您在創建過程中選擇應用皮膚。

基本網格小部件

最後，您可以選擇將您創建的任何基本網格放在小部件中。 這個比其他任何一個都更容易設置，因為它實際上是拖放式的。 進入Appearance – Widgets ，選擇 Essential Grid 小部件並將其拖到您想要呈現的位置。 如果您只想在主頁上使用它，您可以設置它，或者您可以選擇任何預製網格。 但是，您不能像上面那樣以這種方式創建動態網格。 這些必須預先生成。

但是，要記住的一件事是，並非所有佈局在側邊欄中都看起來不錯。 您的某些內容可能會以非常奇怪的方式呈現，但不要驚慌。 如果發生這種情況，只需更改設置，使其顯示不同 - 可能是盒裝而不是全屏，或者甚至可能是砌體而不是 Masonry。 試驗直到它看起來像你想要的那樣。 為此製作側邊欄特定的網格可能是個好主意。 （你可以復制你想要的那個並調整它而不是原始的。）

打孔字體

最後，您可以使用 Essential Grid 進行最後一點自定義。 Punch Fonts是一個在 EG 中使用 Google Fonts 的簡單界面。 就是這樣。

您可以通過按標題很好的添加新字體按鈕來選擇要安裝的字體。 如果您按照模式中的鏈接訪問 Google 字體，您將找到所需的參數，插件會將字體拉入您的網站。

當它說tp- moniker 僅供內部使用時，這僅意味著它與之前的別名基本相同。 當您將字體應用於事物時，您會看到這一點。 所以適當地命名它們。

最後的想法

總的來說，Essential Grid 是目前最強大、最強大的網格插件之一。 如果您曾經使用過 Slider Revolution，那麼佈局和圖層的工作方式與此非常相似，您應該會感到賓至如歸。 如果沒有，當您弄清楚哪些部分適合在一起時，可能會有一些學習曲線。 但是一旦你這樣做了，你將能夠創建一些真正漂亮的頁面。

如果您不需要這種級別的定制，您可能不想支付高價。 還有很多其他網格插件可以滿足您的需求。 此外，根據您製作網格的重量，站點速度可能成為一個問題。 我的意思是，您可以出於某種原因自定義加載動畫。

但是，如果既必要又正確完成，該插件就會真正發揮作用。 Essential Grid 是同類產品中排名第一的賣家是有原因的。 如果您查看評級和支持線程，ThemePunch 會快速回復和提供幫助。

所以對於 27 美元，它可能是值得的入場價格。 另外，如果您是主題設計師，您可以購買他們的擴展許可證並將其作為您自己主題的一個包。 這很酷。

你使用基本網格嗎？ 讓我們在評論中看到您的一些創作！

文章精選圖片來自 Bloomicon / shutterstock.com