您想在WordPress帖子編輯器中使用圖標(biāo)字體嗎？圖標(biāo)字體允許您輕松地在文本中使用圖像和符號(hào)。它們是輕量級(jí)的，不會(huì)減慢您的網(wǎng)站速度，并且可以輕松地縮放到任何大小，并像任何其他文本字體一樣設(shè)置樣式。在本文中，我們將向您展示如何在WordPress帖子編輯器中輕松使用圖標(biāo)字體，而無(wú)需編寫(xiě)任何HTML代碼。

我們將向您展示多種方法，每種方法使用的方法與另一種方法略有不同。您可以選擇最適合您的一種。

 方法 1.使用 JVM 富文本圖標(biāo)在 WordPress 帖子編輯器中添加圖標(biāo)字體

建議在任何類(lèi)型的WordPress網(wǎng)站上使用此方法。它易于使用，并與塊編輯器無(wú)縫協(xié)作。

首先，您需要安裝并激活 JVM 富文本圖標(biāo)插件。

激活后，您只需編輯WordPress帖子或頁(yè)面或創(chuàng)建一個(gè)新帖子或頁(yè)面即可。在帖子編輯器中，添加新的段落塊，您將在塊工具欄中看到一個(gè)新的標(biāo)志圖標(biāo)。

單擊它將顯示一個(gè)圖標(biāo)彈出窗口供您選擇。默認(rèn)情況下，它使用流行的字體真棒圖標(biāo)字體。

您可以使用搜索來(lái)查找圖標(biāo)，或者只需向下滾動(dòng)以查找所需的圖標(biāo)，然后單擊以添加它。

使用圖標(biāo)字體的一個(gè)優(yōu)點(diǎn)是可以使用 CSS 來(lái)設(shè)置它們的樣式。

但是，由于您已經(jīng)在使用塊編輯器，因此您只需使用內(nèi)置的顏色工具來(lái)設(shè)置圖標(biāo)樣式。

該插件允許您在大多數(shù)文本塊中使用圖標(biāo)字體，例如段落、列表、按鈕、列、封面等。

下面是使用圖標(biāo)字體和塊選項(xiàng)設(shè)置三列樣式的示例。

使用圖標(biāo)字體的另一個(gè)有用示例是按鈕。

這次我們使用內(nèi)聯(lián)圖標(biāo)字體以及兩個(gè)按鈕的一些文本。

隨意使用文本對(duì)齊、顏色、間距等塊編輯器工具，以充分利用圖標(biāo)字體。

 方法 2.在WordPress帖子編輯器中添加圖標(biāo)字體

此方法要求您在帖子編輯器中添加短代碼以顯示圖標(biāo)字體。如果您不需要在WordPress帖子和頁(yè)面中定期使用圖標(biāo)字體，則可以使用此方法。

首先，您需要安裝并激活字體真棒插件。

激活后，您可以在WordPress中編輯帖子或頁(yè)面，并使用以下短代碼添加字體圖標(biāo)。

此處的 name 參數(shù)是 Font Awesome 使用的字體名稱。您可以在字體真棒備忘單頁(yè)面上找到整個(gè)列表。

添加后，您可以預(yù)覽帖子或頁(yè)面以查看圖標(biāo)在實(shí)時(shí)站點(diǎn)上的外觀，因?yàn)樗粫?huì)在塊編輯器中顯示為圖標(biāo)。

這就是它在我們的測(cè)試網(wǎng)站上的樣子。

您可以在段落內(nèi)使用簡(jiǎn)碼，并與其他文本內(nèi)聯(lián)。您也可以使用“簡(jiǎn)碼”塊自行添加它。

但是，使用“簡(jiǎn)碼”塊不會(huì)為您提供其他文本塊的樣式選項(xiàng)。

您還可以在列中添加簡(jiǎn)碼以創(chuàng)建功能行。

這會(huì)有點(diǎn)棘手，因?yàn)槟鷮o(wú)法看到實(shí)際圖像，并且列高將在編輯器中不斷變化。

這是它在我們的測(cè)試網(wǎng)站上的樣子。這些列的高度相同，即使它們不在編輯器中也是如此。

您可能需要多次在新的瀏覽器選項(xiàng)卡中預(yù)覽您的作品，以查看用戶的外觀。

 方法 3.將圖標(biāo)字體與WordPress頁(yè)面構(gòu)建器一起使用

如果您正在創(chuàng)建登錄頁(yè)面或使用 WordPress 頁(yè)面構(gòu)建器（如 SeedProd）設(shè)計(jì)您的網(wǎng)站，這種方法非常有用。

SeedProd是市場(chǎng)上最好的WordPress頁(yè)面構(gòu)建器。它使您可以輕松創(chuàng)建漂亮的登錄頁(yè)面或設(shè)計(jì)完整的網(wǎng)站。

首先，您需要安裝并激活 SeedProd 插件。

激活后，系統(tǒng)會(huì)要求您輸入插件許可證密鑰。您可以在SeedProd網(wǎng)站上的帳戶下找到此信息。

輸入許可證密鑰并單擊“驗(yàn)證密鑰”后，您可以開(kāi)始在登錄頁(yè)面上工作。

只需轉(zhuǎn)到 SeedProd ? 登錄頁(yè)面頁(yè)面，然后單擊“添加新登錄頁(yè)面”按鈕。

之后，系統(tǒng)會(huì)要求您為目標(biāo)網(wǎng)頁(yè)選擇一個(gè)模板。

SeedProd 帶有一堆漂亮的設(shè)計(jì)，您可以將其用作起點(diǎn)，或者您可以從空白模板開(kāi)始并自己設(shè)計(jì)整個(gè)內(nèi)容。

在本教程中，我們將使用預(yù)先設(shè)計(jì)的模板。只需單擊模板即可將其選中并繼續(xù)。

接下來(lái)，系統(tǒng)會(huì)要求您為著陸頁(yè)提供標(biāo)題并選擇網(wǎng)址。

輸入后，單擊“保存并開(kāi)始編輯頁(yè)面”按鈕繼續(xù)。

SeedProd 現(xiàn)在將啟動(dòng)頁(yè)面構(gòu)建器界面。它是一個(gè)拖放式設(shè)計(jì)工具，您只需指向并單擊任何項(xiàng)目即可對(duì)其進(jìn)行編輯。

您還可以從左欄中拖放塊以向設(shè)計(jì)添加新元素。

在本教程中，我們將添加圖標(biāo)塊。

添加塊后，只需單擊即可編輯其屬性。

左列將更改以顯示圖標(biāo)塊的選項(xiàng)。您可以單擊左側(cè)的“圖標(biāo)”部分，然后選擇其他圖標(biāo)圖像或更改顏色和樣式。

在 SeedProd 中使用圖標(biāo)的另一種方法是添加“圖標(biāo)框”塊。

這與我們之前使用的“圖標(biāo)”塊之間的區(qū)別在于，“圖標(biāo)框”允許您添加文本以及您選擇的圖標(biāo)。

這是在顯示產(chǎn)品功能、服務(wù)和其他項(xiàng)目時(shí)使用圖標(biāo)的最常見(jiàn)方法之一。

您可以將圖標(biāo)框放在列內(nèi)，選擇顏色，并根據(jù)自己的喜好調(diào)整圖標(biāo)大小。

此外，您還可以使用 SeedProd 的格式工具欄設(shè)置隨附文本的格式。

完成頁(yè)面編輯后，不要忘記單擊屏幕右上角的“保存”按鈕。

如果您準(zhǔn)備好了，您可以單擊“發(fā)布”以使頁(yè)面上線，也可以單擊“預(yù)覽”以確保它看起來(lái)像您想要的那樣。

您也可以單擊“另存為模板”，以便您可以在網(wǎng)站的其他部分與 SeedProd 一起重復(fù)使用此設(shè)計(jì)。

以下是圖標(biāo)字體在我們的測(cè)試網(wǎng)站上的外觀。