如何構建您的第一個 WordPress 插件。 分步指南

已發表: 2020-10-06

您是否一直想構建自己的 WordPress 插件,但不知道從哪裡開始? 在本文中,我們將揭開插件的神秘面紗,並揭示構建 WordPress 插件實際上是多麼容易。 您會驚訝於您能以多快的速度做到這一點,並希望為使用自定義插件向您的 WordPress 網站添加功能所提供的幾乎無限的可能性感到興奮。

事實證明,WordPress 作為 CMS(內容管理系統)如此受歡迎的主要原因之一是,部分由於其開源性質,它可以大量自定義使用 WordPress 構建的網站的設計和功能對於可以實現的目標幾乎沒有限制。

您可以通過兩種方式做到這一點。 首先,通過編寫代碼來改變您的 WordPress 網站的設計或功能。 第二種(也是最流行的方式)是利用像 Elementor 這樣的網站構建器插件來改變您網站的設計/外觀,然後使用更多插件來添加功能。 任何人都可以使用插件……大多數都需要很少的技能來設置,並且不需要編碼經驗,這使它們成為一個非常強大的工具。

什麼是插件,我為什麼要創建一個?

您可能已經知道(或現在可能已經猜到)WordPress 中的插件用於擴展 WordPress 網站的功能。 WordPress“開箱即用”,具有許多準備就緒的有用功能。 插件允許您增強可用的內置功能或快速輕鬆地添加全新的功能,而無需編碼。 將 WordPress 插件視為允許您創建根據您的確切要求構建的網站的工具之一。

那麼,你從哪裡獲得插件呢? 嗯,最好的起點之一是 WordPress 插件目錄,其中包含(在撰寫本文時)57,592 個免費插件,所有這些都旨在讓您以某種方式增強您的網站。 如果您需要一個提供特定特性或功能的插件,那麼很有可能有人已經構建了一個插件來完成這項工作並將其添加到目錄中供您使用。

WordPress 插件目錄

那麼為什麼要構建自己的插件呢? 嗯,有幾個原因。 首先是許多第三方插件會遭受“功能膨脹”的困擾。 換句話說,它們可能包含比您真正需要的更多的功能。 這會使插件的設置和維護變得更加複雜。

構建自己的插件的第二個也是最可能的原因是您無法找到提供您需要的確切特性或功能的第三方插件。 在沒有第三方提供合適的插件的情況下,您唯一的選擇是構建自己的(或讓別人為您做)。 作為獎勵,您很可能可以通過將新插件出售給同樣想要您為自己的網站創建的特性或功能的其他人來獲利。

使用 Pressidium 託管您的網站

60 天退款保證

查看我們的計劃

構建您的 WordPress 插件

讓我們深入了解並完成構建自己的插件所需的步驟。 這是一個有趣的過程,它提供了一個充滿可能性的世界。

命名你的插件

在我們開始任何編碼之前,我們首先需要命名我們的插件。 此名稱是唯一的,這一點很重要。 這樣它就不會與您網站上安裝的任何其他插件衝突。 為了“未來證明”您的插件,如果您選擇將其上傳到 WordPress 插件目錄,則值得檢查名稱是否與已經可用的數千個插件中的任何一個發生衝突。 您可以通過在 WordPress 插件目錄上進行搜索來做到這一點。

還強烈建議插件的名稱代表插件的實際作用。 如果您確實發布了它,這也會增加其他人在 WordPress 目錄中找到它的可能性。

決定你的插件目標

在您捲入構建插件的實際過程之前,首先要仔細定義您想要通過插件實現的目標。 當你的最終目標很清楚時,設計一些東西要比在你想要的功能明顯無法交付時重新設計你的插件要容易得多。

在本教程中,我們將構建一個插件,它會在每篇博客文章的底部自動添加一個按鈕。 雖然當然可以在文章底部手動添加一個按鈕,但每次我們添加博客文章時這樣做會相當耗時。 在擁有數千篇文章的網站上,編輯每篇文章以添加這樣一個按鈕將是一項艱鉅的任務。

在這種情況下,自動執行此操作的插件將為我們節省大量時間。 這是需要構建您自己的插件的任務類型的經典示例。 我們將此插件稱為“在帖子按鈕下”。

現在我們已經定義了它的功能並命名它,我們可以開始構建它了!

注意:始終使用登台服務器來測試您的插件,而不是實時網站。

第 1 步:創建所需的文件/文件夾以使插件正常運行

在此初始步驟中,我們將創建一個插件並將其註冊到我們的網站。 我們不需要擔心在這個階段添加任何功能。

創建插件文件夾

首先,通過 SFTP 客戶端訪問您的網站並轉到 /wp-content/plugins 文件夾。 在此文件夾中創建一個具有唯一名稱的新文件夾。 該名稱應與您的插件名稱相似,並且僅包含小寫字母和破折號。 我們的文件夾將被稱為“under-post-button”。

我的自定義插件 - 命名插件文件夾

創建主文件

接下來,在這個新文件夾中,創建一個與我們的文件夾“under-post-button.php”同名的 PHP 文件。

我的自定義插件 - 插件主文件

讓 WordPress 了解該插件

PHP 文件應包含必要的註釋標頭,告訴 WordPress 文件是插件並提供有關它的信息。 您需要在此處遵循特定的標準格式。 根據 WordPress 標準,可用的標頭字段有:

  • 插件名稱
  • 插件 URI
  • 描述
  • 版本
  • 至少需要
  • 需要 PHP
  • 作者
  • 作者 URI
  • 執照
  • 許可證 URI
  • 文本域
  • 域路徑
  • 網絡

插件工作的最低強制性標題註釋是“插件名稱”。 出於本教程的目的,這就是我們將包括的全部內容。 插件中通常包含的其餘標題主要在分發插件時需要(例如上傳到 WordPress 插件目錄)。 我們將在以後的文章中更詳細地介紹這些內容。

要將插件名稱添加到我們的 PHP 文件中,請在代碼編輯器(如 Sublime)中打開您的 PHP 文件並添加以下內容:

 <?php /* Plugin Name: Under Post Button */ ?>

現在前往您的 WordPress 管理員,點擊“插件”,您應該能夠在插件列表中看到您的插件。

您現在可以激活它。 該插件現在可以正常工作,但由於我們沒有編寫任何功能,它實際上不會做任何事情。

第 2 步:向插件添加功能

在插件的 PHP 文件中,添加以下代碼:

 add_action( 'the_content', 'myButton' ); function myButton ( $content ) { return $content .= '<button class="btn">My Button</button>'; }

這段代碼的作用是它使用“add_action()”鉤子來添加我們的回調函數“myButton”。 這意味著“myButton”函數將與每次調用“the_content”操作時執行的默認核心函數一起執行。

默認情況下,“the_content”操作返回當前帖子的內容。 所以,從現在開始,連同內容,我們的自定義輸出也將被打印出來。 如果您現在訪問您網站上的任何博客文章,您將在文章文章末尾看到該按鈕。 因此,如果我們的網站上有 1,000 篇文章,那麼現在所有文章都會在文章末尾顯示此按鈕。 使用插件添加此按鈕顯然比手動為這 1,000 篇文章中的每一篇添加一個按鈕要快得多!

如果您還不熟悉術語“鉤子”和“動作”,或者您需要更好地了解它們在 WordPress 中的工作方式,請查看相關的官方 WordPress 文檔。 Hooks 和 Actions 在 WordPress 中被廣泛使用,因此如果您計劃構建插件,重要的是要牢牢掌握它們是什麼以及它們是如何工作的。

第 3 步:優化我們的插件

我們現在已經成功地在所有 WordPress 文章的底部添加了一個按鈕。 此按鈕是一個很棒的 CTA(號召性用語),可用於鼓勵某人聯繫您的企業。 我們只需要進行一些小的更改,以便此按鈕通過更改顯示的文本並添加超鏈接來充當 CTA,以便在單擊時將您帶到目標頁面。

更改按鈕上顯示的文本

這非常容易。 只需編輯 <button class=”btn”> 標籤後的文本。 在我們的案例中,我們將其更改為“輸入我們的免費抽獎!”

 add_action( 'the_content', 'myButton' ); function myButton ( $content ) { return $content .= '<button class="btn">Enter our FREE Prize Draw!</button>'; }

添加到按鈕的鏈接

如果通過表格輸入我們的免費抽獎,您可以輕鬆添加鏈接,將人們引導至此表格。 出於本示例的目的,我們會將他們引導至我們的“聯繫我們”頁面

add_action( 'the_content', 'myButton' ); function myButton ( $content ) { return $content .= '<a href="YOURDOMAIN.URL/contact/"><button class="btn">Enter our FREE Prize Draw!</button></a>'; }

或者,您可以使用所謂的相對 url,這被認為是在 WordPress 中添加 url 的“正確”方式。

 add_action( 'the_content', 'myButton' ); function myButton ( $content ) { return $content .= '<a href="/contact/"><button class="btn">Enter our FREE Prize Draw!</button></a>'; }

我們開始吧,準備好使用我們自己的自定義 CTA 按鈕來吸引新的聯繫人。

結論

雖然我們創建的插件無疑非常簡單,但它確實展示了插件可以發揮的巨大力量。 只需幾行代碼,我們就可以毫不費力地為我們網站上潛在的數千個頁面添加一個按鈕。 雖然您可能不認為這是您見過的最神奇的插件,但希望我們的教程確實展示了在 WordPress 中構建自定義插件是多麼容易。 考慮到這一點,您現在可以自由地嘗試自己的插件。

在以後的教程中,我們將通過在管理區域中為您的插件構建一個界面來增強我們的插件,在 WordPress 中我們稱之為選項頁面。 這將增加我們插件的功能,讓登錄到 WordPress 管理員的用戶可以輕鬆更改按鈕名稱和 url 等內容,而無需直接更新插件代碼。

創建插件可以非常令人滿意。 網絡上有大量信息可以幫助您。 唯一真正的限制是你的想像力。 快樂的插件構建!