前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >WordPress 技巧:使用自定义字段给日志单独加载 JS 脚本

WordPress 技巧:使用自定义字段给日志单独加载 JS 脚本

作者头像
Denis
发布2023-04-15 15:03:52
6440
发布2023-04-15 15:03:52
举报
文章被收录于专栏:WordPress果酱WordPress果酱

我们在介绍一些 Javasctipt 类库或者特效的时候,为了能够更加清楚的展示 Javascript 的效果,需要在日志中做演示,这个时候我们需要加载 Javascript 脚本或者 CSS 样式表,比如这篇日志:Pluralink:一个链接多个选择,中为了演示 Pluralink 的一个链接显示多个链接效果,就需要在日志中加入 Pluralink 的 Javascript 代码和 CSS 样式表。

但是 WordPress 日志编辑框会对过滤这些 Javascript 脚本,所以我们无法直接把脚本写到日志,如果修改主题,把脚本添加到主题的 header.php 文件中,那么博客所有的页面都会加载这些脚本,这样造成整个博客效率下降。所以这个时候我们可以通过 WordPress 自定义字段来给某篇的日志单独加载 Javascript 脚本和 CSS 样式表

假设我们给日志单独加载 Javascript 脚本的自定义字段是 custom_head。那么你首先需要把下面这段代码复制到你主题的 functions.php 文件中,也可以直接当作一个插件,上传到插件目录中,然后在后台激活。

代码语言:javascript
复制
<?php
/*
Plugin Name: Custom Head
Plugin URI: http://blog.wpjam.com/m/custom-head/
Description: 使用自定义字段给某篇的日志单独加载 Javascript 脚本,使用的自定义字段是 custom_head。
Version: 0.1
Author: Denis
Author URI: http://wpjam.com/
*/
add_action("wp_head","custom_head");
function custom_head(){
    if (is_single() || is_page()) {
        global $post;
        $custom_head = get_post_meta($post->ID, 'custom_head', true);
        echo $custom_head;
    }
}
?>

然后在编辑日志的时候,在自定义字段区域,创建一个新的自定义字段,名字为:"custom_head",输入你要单独为这篇日志加载的 Javascript 代码或者 CSS 样式表即可。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档