WooCommerce：CodeLobster，可能是最好的代碼編輯器

已發表: 2020-07-07
龍蝦

電子商務網站是最具活力的網站。 網站啟動後，開發並沒有停止，並且還在進行中。 沒有程序員的幫助，許多企業就無法銷售他們的產品。

如果您已經具備 PHP 編程技能並了解 WordPress 原理，那麼本文將為您提供如何優化編碼流程的良好開端。

具體來說，我們將著眼於流行的 WooCommerce 插件，並向您展示如何在 CodeLobster IDE 中有效地使用它進行編碼，這是一個比 NotePad++ 或 Atom 複雜得多的代碼編輯器，這是因為它針對 WordPress 和 WooCommerce 進行了優化和開發。

從 CodeLobster 創建一個 WooCommerce 網站

可能您已經閱讀了很多關於在 WordPress 上成功創建在線商店的案例。 您可以放心地選擇它作為在線交易的平台。 這是用於構建此類資源的相當安全的系統。

每個現代 IDE 主要實現良好的 WordPress 支持， CodeLobster 可以輕鬆部署新項目，即在您的計算機（本地開發）或服務器上安裝測試 WordPress 網站。

您可以使用嚮導安裝 CMS。 您只需要輸入管理員數據和服務器地址即可連接 MySQL。

此外，還有一個方便的管理面板，它還集成了插件或主題的集成搜索和快速安裝，以及一種自動更新 WordPress 核心和插件的方法。

WooCommerce 也在那裡，可以快速添加到您的本地/實時安裝中。

使用函數和鉤子自定義 WooCommerce

熟悉 WordPress 概念的開發人員可以快速了解如何自定義 WooCommerce，因為該插件易於配置且其代碼完全可擴展。

PHP 程序員可以使用 WooCommerce 函數和類。 多虧了他們，您將可以訪問 WC 與之交互的全局變量、設置和所有其他資源。

使用這些函數時使用自動完成功能，輸入函數名稱時按 Ctrl + Space，或 Shift + Ctrl + Space 以獲取有關參數的提示。

快速啟動-woocommerce-codelobster-2

在上面的屏幕截圖中，我們編寫了以下代碼： 

//Get WC_Order object by order ID
$order_id = 55;
$order = wc_get_order( $order_id );

//Get customer ID
$customer_id = $order->get_user_id();

WooCommerce 函數wc_get_order () 用於獲取訂單對象，您可以從中提取訂單的任何數據，例如，找出客戶 ID。

如果在按住 Ctrl 鍵的同時單擊其名稱，您可以立即移動到函數定義。 這種方法將幫助您詳細了解函數在 WC 中的工作原理。

當您只需要在內存中快速刷新任何方法的用途並找出要傳遞給它的參數時，請注意將光標懸停在代碼中的某個元素上時出現的工具提示。

快速啟動-woocommerce-codelobster-3

諸如 Actions 和 Filters 之類的鉤子在 WC 中被廣泛使用，因此您可以在不覆蓋核心文件或模板的情況下自定義此類插件。

如果您在文件中選擇“ do_action ”或“ apply_filters ”，編輯器將突出顯示所有掛鉤匹配。

您可以使用操作來顯示其他標記。 您只需要在負責顯示前端的文件中找出它們的位置。 過濾器用於處理或分析數據，例如，當您需要在使用之前更改數組或對象時。

我們可以將必要的功能添加到我們主題中的文件“functions.php”中。 編寫自己的函數並使用add_action () 方法註冊它。

快速啟動-woocommerce-codelobster-4

如果您在 CodeLobster IDE 中使用 WordPress 和 WooCommerce 時使用動態幫助系統，您將節省大量時間。

一旦您開始輸入代碼，IDE 就會自動選擇指向所有函數和對象的官方文檔的鏈接。

快速啟動woocommerce-codelobster-5

轉到程序右側面板上的“動態幫助”選項卡，然後單擊相應的鏈接開始研究瀏覽器中的文檔。

在 WooCommerce 中覆蓋模板文件

WooCommerce 有自己的模板系統——前端模板文件位於“ wp-content/plugins/woocommerce/templates/ ”文件夾中。

從技術上講，如果您希望設計自定義購物車頁面或徹底編輯單個產品頁面，您可以“覆蓋”相關模板文件並將其放置在您的子主題文件夾中。 除非您想使用鉤子和過濾器，從開發的角度來看，它們更容易和更清潔。

要開始使用模板，請在您的主題文件夾中創建一個“ woocommerce ”文件夾。 現在您可以復制任何您想要覆蓋的 WooCommerce 模板並將其放置在那裡。 WooCommerce 會找到這樣的覆蓋並加載你的而不是默認的。

您可以將 HTML、純文本或 PHP 代碼直接插入到模板文件中，方法是用“ <?php .... ? > ”標籤。

快速入門-woocommerce-codelobster-6

在此示例中，我們從“ woocommerce/templates/cart/cart.php ”中獲取購物車頁面模板文件，將其複制並粘貼到子主題的 /woocommerce 文件夾中（“ storefront-business/woocommerce/cart/cart.php ” )，然後對其進行自定義。

現在，用於顯示購物車頁面的標準模板已被重寫，我們所做的所有更改都將被考慮在內。

有效的電子商務項目團隊合作

通常，大型在線商店由程序員團隊開發和支持。 CodeLobster IDE 通過與 Git 集成可以輕鬆維護項目源代碼。

可以使用本地和遠程存儲庫，創建新分支以進行安全測試並使用提交保存更改。

大多數 Git 命令可以直接從項目的上下文菜單中執行，例如，要創建提交，只需選擇“Git”->“提交”。

同時，CodeLobster IDE 提供了一個方便的對話框，您可以在其中立即看到項目所有文件的狀態，並能夠選擇需要添加到快照的文件。

IDE 帶有方便的圖形工具，用於查看更改歷史記錄和比較不同版本的文件。 無需分心並運行第三方實用程序。

執行“Git”->“History”命令後，我們有機會可視化整個修改歷史，依次移動提交。

下一個有用的命令“Git” -> “Compare” 可以輕鬆檢查編輯歷史並查看不同提交中同一文件的所有修改。

查看版本的便捷方式將幫助您快速處理編輯，即使它們是由其他開發人員進行的。 不同或已添加的代碼行以紅色突出顯示。

對良好 VCS 的支持可確保源代碼的完整性，以及整個項目的輕鬆管理。 內置功能對任何規模的團隊都很有用，包括年輕的程序員和專業人士。

網站所有者將能夠吸引訪問者並開始銷售，而開發團隊將繼續引入新功能併計劃網站的擴展，而不必擔心破壞商店現有穩定代碼的工作。

讓我們總結一下

要使用 WordPress 快速實施新的數字解決方案，您需要一個可靠且功能強大的 IDE。 Codelobster 全面支持該系統和其他流行的 CMS，用於所有業務任務：Joomla、Drupal 和 Magento。

Web 開發人員將不得不解決大部分即將到來的任務，因此請為認真的工作做好準備，並為很快出現許多有趣的項目做好準備。