首页 > 解决方案 > 如何将头部中的脚本标签添加到 cpanel 中的 wordpress 主题?

问题描述

我试图向 wordpress 主题添加一个脚本标签,这似乎是一项简单的任务,但它没有成功!

我在 wp-content>themes>them_name - header.php 下编辑 header.php 文件

当我添加脚本标签并尝试重新加载页面时,我在标题部分看不到脚本标签。

我什至清除了互联网上建议的浏览器缓存。

请建议我一些选项,因为我不是 wordpress 专家。

谢谢

标签: javascriptphpwordpressheader

解决方案


一般的

在 WordPress 中添加脚本的正确方法是使用wp_enqueue_script()

https://developer.wordpress.org/reference/functions/wp_enqueue_script/

将以下代码放在functions.php中:

function custom_wp_enqueue_scripts() {
    wp_enqueue_script('script-name', get_template_directory_uri() . '/path/to/script/name.js', array(), '1.0.0', false);
}
add_action('wp_enqueue_scripts', 'custom_wp_enqueue_scripts');

注意第 5 个参数是false. 这会将脚本添加到头部而不是正文的末尾。

您的具体情况:

function custom_wp_enqueue_scripts() {
    wp_enqueue_script('web-manager', 'domain.tld/js/web-manager.min.js', array(), '1.0.0', false);
}
add_action('wp_enqueue_scripts', 'custom_wp_enqueue_scripts');

因为您的脚本需要asyncdata-key="abc123efg"属性,所以您还必须将此代码添加到 functions.php 中:

function custom_script_loader_tag($tag, $handle, $src) {
  if ('web-manager' === $handle) {
    $tag = '<script type="text/javascript" async src="' . $src . '" data-key="abc123efg"></script>';
  }
  return $tag;
}
add_filter('script_loader_tag', 'custom_script_loader_tag', 10, 3);

推荐阅读