如何将WordPress移动到WordPress的底部或页脚

最近,我们的一位读者问我们如何将JavaScript移到WordPress的底部来提高他们的Google页面速​​度分数。 我们很高兴他们问,因为老实说我们想写这个。 以前,我们已经讨论过如何在WordPress中正确添加JavaScript和CSS样式。 在本文中,我们将向您展示如何将JavaScript移动到WordPress的底部,以便您可以提高网站加载时间和Google网页速度分数。

将JavaScript移到底部的好处

JavaScript是一种客户端编程语言。 它由用户的Web浏览器执行并运行,而不是由您的Web服务器执行。 当您将JavaScript放置在顶部时,浏览器可能会在加载页面的其余部分之前执行或处理JavaScript。 当JavaScript被移动到底部时,您的Web服务器将快速呈现页面,然后用户的浏览器将执行JavaScript。 由于所有的服务器端渲染已经完成,JavaScript将在后台加载,使得整体加载速度更快。

当使用Google网页速度或Yslow进行测试时,这会提高您的速度分数。 Google和其他搜索引擎现在正在将页面速度视为显示搜索结果时的性能矩阵之一。 这意味着加载速度更快的网站在搜索结果中显得更为突出。

在WordPress中添加脚本的正确方法

WordPress有一个功能强大的排队系统,允许主题和插件开发者将他们的脚本添加到队列中,并根据需要加载它们。 正确排列脚本和样式可以显着提高页面加载速度。

为了向您展示一个基本示例,我们将在WordPress主题中添加一些JavaScript。 保存你的JavaScript在一个 .js文件 文件和地方 .js文件 文件在你的主题中 JS 目录。 如果您的主题没有JavaScript的目录,请创建一个。 放置脚本文件后,编辑你的主题 的functions.php 文件并添加以下代码:

函数wpb_adding_scripts(){
 wp_register_script('my-amazing-script',get_template_directory_uri()。'/js/my-amazing-script.js','','1.1',true);
 wp_enqueue_script( '我的-惊人脚本');
 }
 add_action('wp_enqueue_scripts','wpb_adding_scripts'); 

在这段代码中,我们使用了wp_register_script()函数。 该功能具有以下参数:

要将脚本添加到WordPress页面的页脚或底部,您只需设置即可 $ in_footer 参数 真正

我们也使用了另一个功能 get_template_directory_uri() 它返回模板目录的URL。 这个函数应该用于排列和注册WordPress主题中的脚本和样式。 对于我们将要使用的插件 plugins_url() 功能。

问题:

问题是有些时候WordPress插件添加他们自己的JavaScript到页面里面

或页面内部。 为了将这些脚本移动到底部,您需要编辑插件文件并将脚本正确地移动到底部。

寻找JavaScript来源

在网络浏览器中打开您的网站并查看页面源代码。 您将看到JavaScript文件的链接,指出文件的位置和来源。 例如,下面的截图告诉我们,我们的脚本属于一个名为“test-plugin101”的插件。 脚本文件位于 JS 目录。

在WordPress中查找脚本的来源

有时您会看到JavaScript直接添加到页面中,而不是通过单独的.js文件链接。 在这种情况下,您需要逐个停用所有插件。 停用每个插件后刷新页面,直到找到将脚本添加到页面的页面。 如果即使停用所有插件,JavaScript也不会消失,然后尝试切换到另一个主题以查看JavaScript是否由您的主题添加。

注册和排队脚本

一旦找到在头部分添加JavaScript的插件或主题,下一步就是找出插件在哪里调用文件。 在你的主题或插件的PHP文件之一,你会看到一个特定的电话 .js文件 文件。

如果插件或主题已经使用排队来添加JavaScript文件,那么只需要在插件或主题中更改wp_register_script函数,并为$ in_footer参数添加true即可。 喜欢这个:

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

让我们假设你的插件或主题是在标题或内容之间添加原始JavaScript。 在插件或主题文件中查找原始JavaScript代码,复制JavaScript并将其保存在 .js文件 文件。 然后使用 wp_register_script() 功能如上所示,将JavaScript移动到底部。

编者按:重要的是要知道,当你修改核心文件并更新插件时,你的改变不会被覆盖。 一个更好的方法是取消注册脚本,并从主题的functions.php文件重新注册。 看到这个教程。

除了将脚本移动到页脚之外,您还应该考虑使用更快的社交媒体插件和延迟加载图像。 除此之外,您还应该使用W3 Total Cache和MaxCDN来提高您的网站速度。

我们希望这篇文章能帮助您将JavaScript移到WordPress的底部,并提高您的页面速度。 有关问题和反馈,请在下面留言。