【问题标题】:How to replace scripts in WordPress with the ones from CDN?如何将 WordPress 中的脚本替换为 CDN 中的脚本?
【发布时间】:2019-02-19 10:28:51
【问题描述】:

我是wordpress的新手。

Wordpress、主题或插件中总有一些来自 CDN 的 JS 和 Css,例如:

https://ajax.googleapis.com/ajax/libs/webfont/1.5.0/webfont.js

https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css

不幸的是,这些外部CDN资源在我们国家非常缓慢,会导致我们的网站严重延迟。

请问是否可以用本地服务器副本替换它?

请问我该怎么做?

提前致谢。

【问题讨论】:

标签: javascript wordpress


【解决方案1】:

您在 cmets 中获得的一个解决方案是如何在本地加载 jQuery,以防万一您有任何其他脚本或样式在 WordPress 默认情况下在本地不可用,因此您可以使用wp_enqueue_script

/** * 将脚本和样式排入队列的正确方法。 */

函数 wpdocs_theme_name_scripts() {

wp_enqueue_style( 'style-name', get_stylesheet_uri() );

wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );

}

add_action('wp_enqueue_scripts', 'wpdocs_theme_name_scripts');`

【讨论】:

  • 您好,我不明白“1.0.0”是什么意思,请您澄清一下吗?谢谢
  • 当然,我们可以在这里作为参数管理脚本的版本。目前,它是静态的 1.0.0,您可以使用任何变量来代替。有时我们有动态文件从同一源返回脚本。例如xyz.com/scripts.php?ver=1.0.0 所以这个文件可以在不同的版本上做出不同的响应,比如这个xyz.com/scripts.php?ver=1.0.1
  • 感谢您的回复,我通过代码片段的插件添加了您的代码行作为屏幕截图:prntscr.com/mpb5ez,但它不起作用:prntscr.com/mpb5n3。顺便说一句,我们的服务器在中国,我们无法访问谷歌公共资源,这就是我需要用本地副本替换它的原因。
  • 确保在函数 add_action( 'wp_enqueue_scripts', 'wpdocs_theme_name_scripts' ); 之后没有遗漏这一行
  • 嗨,谢谢。我对此进行了测试:prntscr.com/mptsab 但它仍然不起作用。prntscr.com/mptu74 这个插件适用于我们:wordpress.org/plugins/useso-take-over-google 它将用中国本地 CDN 资源替换 google 资源,不幸的是,它与其他插件中的 jquery-ui.css 无关,如果在 wp-config.php 中启用调试,也会有一些错误消息。 3年没更新了,作者没有回复。也许我问我应该在哪里做志愿者
【解决方案2】:

嗯,你总是可以覆盖你当前的主题来排队你的 css 和 js。基本上去:

wordpress/wp-content/themes/(你使用的主题)/functions.php

您需要修改“functions.php”文件并添加一个操作,以便将您的新脚本和样式排入队列。

function mynew_scripts() {
wp_enqueue_script('webfont', 'https://ajax.googleapis.com/ajax/libs/webfont/1.5.0/webfont.js');
wp_enqueue_style('jquery-ui', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css');

//And for local file use get_template_directory_uri() to get the path
wp_enqueue_script('yourjsfile',get_template_directory_uri().'/yourthemedir/assets/js/yourjsfile.js');
wp_enqueue_style('yourcssfile',get_template_directory_uri().'/yourthemedir/assets/js/yourcssfile.css');


}

add_action('wp_enqueue_scripts', 'mynew_scripts');

检查这些功能 wp_enqueue_script , wp_enqueue_style

【讨论】:

  • 谢谢,请问我应该在哪个目录输入“mynew_scripts”?但是真的不明白这种方式,这是否意味着如果CDN失败则回退到本地副本?谢谢
  • 如果是,那不是我想要的,我只想用本地副本替换它,因为我们完全无法访问 CDNS,谢谢
  • 嗨 @Li Alex 根据通常的指南,每个 Wordpress 主题都有一个名为 assets 的文件夹,其中包含两个子文件夹 Js 和 Css,因此您将本地脚本复制到这些文件夹:wordpress/wp-content/themes/ (您使用的主题)/Assets/Js 。很高兴它有帮助,如果它对你有用,请将我的答案标记为已接受:)
  • 您将本地副本放在资产文件夹中,然后使用适当的 wordpress 功能将它们排入队列,如果您想要 cdn,您可以使用两种相同的方式。还要检查 add_action 和 priority arg 可能会有所帮助。
  • 嗨,@aness,我不是技术背景,但我可以通过 Sftp 访问那些 wordpress 文件,请问您可以给我发送一个实例以放入 CHILD THEME 的 function.php 中,或者通过代码片段插件?
猜你喜欢
  • 2017-03-17
  • 2021-01-01
  • 1970-01-01
  • 2016-08-05
  • 2021-06-26
  • 1970-01-01
  • 1970-01-01
  • 2011-02-14
  • 2018-07-09
相关资源
最近更新 更多