如何將 JavaScript 移動到 WordPress 的底部或頁腳

最近,我們的一位讀者問我們?nèi)绾螌?JavaScript 移動到 wordpress 的底部以提高他們的 google 頁面速度得分。我們很高興他們提出這個問題,因為老實說我們想寫下這個。之前,我們討論過如何在 WordPress 中正確添加 javascript 和 css 樣式。在本文中,我們將向您展示如何將 javascript 移至 wordpress 底部,以便您可以縮短網(wǎng)站加載時間并提高 google 頁面速度得分。

將 JavaScript 移至底部的好處

JavaScript 是一種客戶端編程語言。它由用戶的 Web 瀏覽器而不是您的 Web 服務(wù)器執(zhí)行和運行。當(dāng)您將 JavaScript 放在頂部時,瀏覽器可能會在加載頁面的其余部分之前執(zhí)行或處理 JavaScript。當(dāng) JavaScript 移至底部時,您的 Web 服務(wù)器將快速呈現(xiàn)頁面,然后用戶的瀏覽器將執(zhí)行 JavaScript。由于所有服務(wù)器端渲染已經(jīng)完成,JavaScript 將在后臺加載,從而使整體加載速度更快。

當(dāng)使用 Google 頁面速度或 Yslow 進行測試時,這將提高您的速度得分。谷歌和其他搜索引擎現(xiàn)在正在將頁面速度視為顯示搜索結(jié)果時的性能矩陣之一。這意味著加載速度更快的網(wǎng)站將在搜索結(jié)果中更加突出地出現(xiàn)。

在WordPress中添加腳本的正確方法

WordPress 有一個強大的排隊系統(tǒng),允許主題和插件開發(fā)人員將他們的腳本添加到隊列中并根據(jù)需要加載它們。正確排列腳本和樣式可以顯著提高頁面加載速度。

為了向您展示一個基本示例,我們將在 WordPress 主題中添加一些 JavaScript。將 JavaScript 保存在.JS文件中,并將該.js?文件放置在主題的js目錄中。如果您的主題沒有 JavaScript 目錄,請創(chuàng)建一個目錄。放置腳本文件后,編輯主題functions.php文件并添加以下代碼:

立即學(xué)習(xí)Java免費學(xué)習(xí)筆記(深入)”;

如何將 JavaScript 移動到 WordPress 的底部或頁腳

有時您會看到 JavaScript 直接添加到頁面中,而不是通過單獨的 .js 文件鏈接。在這種情況下,您需要一一停用所有插件。停用每個插件后刷新頁面,直到找到將腳本添加到頁面的插件。如果即使停用所有插件后 JavaScript 也沒有消失,請嘗試切換到另一個主題以查看您的主題是否添加了 JavaScript。

注冊和入隊腳本

一旦您找到在標(biāo)頭部分添加 JavaScript 的插件或主題,下一步就是找出該插件調(diào)用該文件的位置。在您的主題或插件的 PHP 文件之一中,您將看到對該特定文件的調(diào)用.js。

如果插件或主題已經(jīng)使用排隊來添加 JavaScript 文件,那么您所需要做的就是更改插件或主題中的 wp_register_script 函數(shù),并為 $in_footer 參數(shù)添加 true 。像這樣:

wp_register_script('script-handle', plugins_url('js/script.js', __FILE__),'','1.0',true);

在 WordPress 中一鍵使用

假設(shè)您的插件或主題在標(biāo)題中或內(nèi)容之間添加原始 JavaScript。在插件或主題文件中找到原始 JavaScript 代碼,復(fù)制 JavaScript 并將其保存在文件中.js。然后使用wp_register_script()?如上所示的函數(shù),將 JavaScript 移動到底部。

編者注:重要的是要了解,當(dāng)您對核心文件進行更改并更新插件時,您的更改將不會被覆蓋。更好的方法是取消注冊腳本并從主題的functions.php 文件中重新注冊它。請參閱本教程。

除了將腳本移至頁腳之外,您還應(yīng)該考慮使用更快的社交媒體插件和延遲加載圖像。除此之外,您還應(yīng)該使用W3 Total Cache 和 MaxCDN來提高網(wǎng)站速度。

? 版權(quán)聲明
THE END
喜歡就支持一下吧
點贊14 分享