使用Enqueue将脚本和样式添加到WordPress

我们中的许多人使用样式来改变我们网站的外观，以及脚本以增强功能.但是，重要的是要注意，您将这些脚本添加到WordPress的方式与这些文件的内容同样重要.而不是将它们普及入头或页脚文件，我们需要使用Wordpress'enqueue功能.

在本文中，我将向您展示如何为您的主题和插件添加脚本和样式，无论您是在前端还是在后端创建某些内容.

我们将介绍:

• 什么是enqueing
• eNqueuing:底线
• 恩加尔正确资产
• 详细延伸
• 资产注册
• 删除脚本和样式

什么是enqueing?

eNqueue是一个CMS友好的方式，可以将脚本和样式添加到WordPress网站.您拥有的多个插件可能会使用jQuery和其他共享脚本.如果分别链接到这些资产的每个插件，则会随之而来，您的所有JavaScript都可以停止工作.

通过划分脚本，您正在告诉WordPress关于您要添加的资产，它将实际将其视为标题和页脚中的实际链接.您甚至可以指定脚本和样式的依赖项，并且WordPress将按正确的顺序添加它们.

从核心和插件的主题所需的所有信息都创建了所需的脚本和样式列表，并将它们输出到正确的位置.

Liqueing:底线

无论您如何附上资产，最终结果将是您网站HTML某处的<script>或<link>标记.下面的示例显示了网站上的三个脚本和两种样式:

加载GIST 37363697DED3703B37C38C13DCB26A7B

功能-明智，这是完全罚款，但让我们不要忘记WordPress是任务的，比我上面所展示的更多.可能有一些其他脚本和曲目挂在一起.自从您包含脚本和样式的顺序很多，如果您刚刚开始将它们放入主题的标题或页脚中，您可能会很快丢失.

此外，这些脚本中的大多数在您的主题的PHP代码中都不可见.所有脚本WordPress和其他插件都需要通过wp_head()和wp_footer()函数添加.

延时资产正确

enqueue是一种让Wordpress了解您的脚本及其依赖的方法.基于此，WordPress为您提供脚本的位置.由于这一切都是通过代码完成的，因此在需要添加新的代码时，您不必担心重新排列脚本.让我们通过前一节中的脚本，通过enqueue来添加它们:

加载GIST 5EBA5EE0510468136602049A397A4949A

此代码应放在主题，子主题或插件文件中的functions.php文件中.请注意，通过将函数附加到wp_enqueue_scripts钩子，脚本和样式都会排队.

我排队的前两件事是我们的风格.我首先定义了我们的主题风格，即使它取决于重置样式.因为我在第三个参数中定义了此依赖性，这不是问题.第一个参数是资产的唯一名称，第二个参数是其位置.

我添加的第三种资产是优秀的猫头鹰旋转木马.在第三个参数中，我将jQuery指定为依赖项.我不需要询问自己，因为它被构建为WordPress.查看包含包含脚本列表的WordPress Codex.

最后，我包括主题脚本.我们的脚本取决于jquery和猫头鹰旋转木马.实际上，你可以逃脱只是将猫头鹰旋转木马定义为依赖.由于jQuery是对猫头鹰转盘的依赖，因此在任何情况下都将包括在它之前.也就是说，我喜欢完全陈述我的依赖关系，它在查看代码时给我更多信息.

拼图的最后一块是确保我们的主题脚本加载到页脚中.这可以通过将第五参数定义为true来完成.第四个参数是我设置为1.0的可选版本号.

详细延长

现在你已经看过一个例子，让我们让我们的手脏了，看看我们可用的所有功能和参数.

我们使用了两个功能:wp_enqueue_script()和wp_enqueue_style().他们都需要五个参数，共享前四个:

加载GIST 915B8254122A3E704612867F8E1F1379

• 句柄:这是脚本或风格的名称.最好只在这里使用小写字母和破折号，并确保使用唯一的名称.
• 源:脚本或样式的URL.确保使用get_template_directory_uri()或plugins_uri()等函数.
• 依赖关系:脚本或样式取决于资产的句柄数组.这些将在剪报脚本之前加载.
• 版本:将附加到查询的版本号.这可确保用户收到正确的版本，无论缓存如何.
• in_footer:此参数仅适用于脚本.如果设置为true，则脚本将通过页面底部的wp_footer()加载.
• 介质:此参数适用于样式，它允许您指定应显示样式的介质类型.例如:屏幕，打印，手持设备等.

希望对参数的解释使我们的示例在上一节中更清晰.您现在可以使用自己的风格和脚本开始玩.

资产注册

实际上是添加资产的两个步骤，但戒断功能可以一次完成它.技术上脚本和样式首先注册，然后排队.注册让WordPress了解您的资产，同时lequeing实际将它们添加到页面上.这是添加我们的猫头鹰旋转木马的另一种方法:

加载GIST A5EAEBBBBB15320A1C7DE7716C02A3B9.

那么为什么这是一个足够的两个步骤?答案是，在某些情况下，您不会在与您征存的同一位置注册脚本.一个很好的例子是短路.假设您创建的短代码需要一些JavaScript.如果通过将其附加到wp_enqueue_scripts钩子将其附加到每个请求中，即使不使用短代码，它将被加载.

答案是使用wp_enqueue_scripts钩子注册脚本，但在短码功能中浏览它.只有在实际使用短码时，这将加载它.如果在多次使用短码时，脚本只会包括一次，所以我们覆盖了所有基础.

wp_register_scripts()和wp_register_styles()函数与他们的eNqueut brethren共享相同的参数.唯一的区别是eNqueue函数允许您只指定手柄，只要该句柄已注册.

删除脚本和样式

WordPress为脚本和样式提供脱离力和解吸功能.

• wp_deregister_script()
• wp_deregister_style()
• wp_dequeue_script()
• wp_dequeue_style()

这些功能允许我们模块化删除资产.以下示例显示了如何将jQuery轻松删除并替换为更新版本.

加载GIST 702C31353253E89913A7A42B4B2A59F8

所说，用新版本替换jQuery几乎绝不是一个好主意.WordPress建于默认情况下按钮尽可能顺利地工作.更换它不应该轻轻拍摄.

求和

希望，你现在看看为什么戒断是如此重要的过程.它需要依赖屈曲维护的负担，并允许您以模块化和可管理的方式添加脚本.

所有WordPress插件和主题需要延期.您的产品(免费或溢价)将不被接受到WordPress存储库中，并且没有它.它构成了"与他人很好"的基础，也应该是每个开发人员.