首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

自定义WordPress主题加载js,但不加载样式表

在自定义WordPress主题中,你可以通过以下步骤来实现仅加载JavaScript而不加载样式表:

  1. 创建自定义主题文件夹:首先,在WordPress的主题目录中创建一个新的文件夹,用于存放你的自定义主题文件。
  2. 创建主题样式表文件:在自定义主题文件夹中创建一个名为style.css的文件,但不需要在其中添加任何样式。
  3. 创建主题功能文件:在自定义主题文件夹中创建一个名为functions.php的文件,用于添加自定义功能和加载JavaScript。
  4. 编辑主题功能文件:在functions.php文件中添加以下代码来加载JavaScript,并禁用样式表的加载:
代码语言:txt
复制
<?php
// 禁用主题样式表的加载
function disable_theme_styles() {
    wp_dequeue_style('your-theme-stylesheet-handle'); // 请替换为你主题的样式表句柄
    wp_deregister_style('your-theme-stylesheet-handle');
}
add_action('wp_enqueue_scripts', 'disable_theme_styles', 20);

// 加载自定义JavaScript文件
function load_custom_scripts() {
    wp_enqueue_script('your-custom-script', get_template_directory_uri() . '/js/custom.js', array('jquery'), '1.0', true); // 请替换为你的自定义JavaScript文件路径
}
add_action('wp_enqueue_scripts', 'load_custom_scripts', 20);

在上述代码中,你需要将'your-theme-stylesheet-handle'替换为你的主题样式表的句柄,以确保正确地禁用样式表的加载。同时,你还需要将'your-custom-script'替换为你的自定义JavaScript文件的句柄,以及'get_template_directory_uri() . '/js/custom.js''替换为你的自定义JavaScript文件的路径。

请注意,上述代码应该在你的主题功能文件的末尾添加。

  1. 保存并上传文件:保存你的主题样式表文件(style.css)和主题功能文件(functions.php),并将它们上传到WordPress的主题目录中的自定义主题文件夹。

完成以上步骤后,WordPress将只加载你的自定义JavaScript文件而不加载主题的样式表。

希望这个答案对你有帮助!如有任何疑问,请随时提问。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

WordPress主题加载jQuery的最佳方法

WordPress模板中加载JavaScript和jQuery的最佳方法是使用wp_enqueue_script。这样可以更好的控制JavaScript文件的加载时间点和加载位置。...下图是我在丘壑博客上添加的用于代码语法高亮的JavaScript,放在子主题的functions.php文件中。...在子主题的文件夹中,创建一个名为js的文件夹,然后把需要的JavaScript文件放在里面。路径应该是这样子:child-theme-directory/js/filename.js ?...在Wordpress中注册prism.js 速度优化 在下面的代码片段中,我们先把WordPress中默认自带的jQuery库取消注册,然后在页面最后部分加载国内的CDN版本。...使用CDN版本的jQuery可以提升加载速度 ,使用户可以就近取得所需的内容,提高用户访问网站的响应速度。将下面的代码放在子主题的functions.php文件中即可。 ?

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

    我们在介绍一些 Javasctipt 类库或者特效的时候,为了能够更加清楚的展示 Javascript 的效果,需要在日志中做演示,这个时候我们需要加载 Javascript 脚本或者 CSS 样式表,...但是 WordPress 日志编辑框会对过滤这些 Javascript 脚本,所以我们无法直接把脚本写到日志,如果修改主题,把脚本添加到主题的 header.php 文件中,那么博客所有的页面都会加载这些脚本...所以这个时候我们可以通过 WordPress 自定义字段来给某篇的日志单独加载 Javascript 脚本和 CSS 样式表。...假设我们给日志单独加载 Javascript 脚本的自定义字段是 custom_head。...> 然后在编辑日志的时候,在自定义字段区域,创建一个新的自定义字段,名字为:"custom_head",输入你要单独为这篇日志加载的 Javascript 代码或者 CSS 样式表即可。

    66020

    WordPress Ajax 异步加载 自定义评论表情

    最近为了考试都复习成狗熊样啦~~我要缓缓折腾折腾WordPress 先。今天带来本人最新的折腾成果: Ajax异步加载自定义评论表情。...WordPress Ajax 异步加载 自定义评论表情效果 直接在点击下面的评论框效果就出来了,有兴趣的可以用开发者工具看看是不是异步加载。 效果图示: ? ?...注意: 在开始本教程前请确保你已经看过《WordPress中添加自定义评论表情包的方法(附三套表情包下载)》原文并在你的主题上实现该功能,要求下载的smilies[devework.com].zip文件在这里有用...WordPress Ajax 异步加载 自定义评论表情教程: 一、删除你主题上来自于《WordPress中添加自定义评论表情包的方法(附三套表情包下载)》一文的所有代码(重要!)...; 二、确保你的主题已经加载了jquery.js文件(具体都应该懂的吧,不懂留言~)。

    1.7K91

    如何自定义加载器_网易js加载器下载地址

    1.什么情况下需要自定义加载器? (1)隔离加载类:在某些框架内进行中间件与应用的模块隔离,把类加载到不同的环境。...比如,某容器框架通过自定义加载器确保应用中依赖的jar包不会影响到中间件运行时使用的jar包。...(3)扩展加载源:比如从数据库、网络,甚至是电视机机顶盒进行加载。 (4)防止源码泄露。java代码容易被编译和篡改,可以进行编译加密。那么类加载器也需要自定义,还原加密的字节码。...new ClassNotFoundException(name); } private byte[] getClassFromCustomPath(String name) { // 从自定义路径中加载指定类...主流的容器类框架都会自定义加载器,实现不同的中间件之间的类隔离,有效避免了冲突。 版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。

    1.8K30

    WordPress 技巧:设置不同的访问设备加载不同的主题

    有些时候我们需要在特定情况下(如移动设备访问时)加载不同于站点现在选择的 WordPress 主题,可以使用以下代码: //根据访问设备切换 WordPress 主题 function wpjam_switch_theme...', 'wpjam_switch_theme' ); add_filter( 'stylesheet', 'wpjam_switch_theme' ); 你可以根据上面的代码自行修改,在何种设备访问时加载什么主题...注意主题名字一定是主题文件夹名字,而不是后台管理界面你看到的主题名字。而且这次代码也不能直接扔进 functions.php 文件中而是要做成一个插件上传启用。...不过还要注意一点,在这里我用了wp_is_mobile()这个wordpress自带函数来检测移动设备,不过这个很不准确,有很大可能不能正确判断移动设备。

    81730

    WordPress 通过模板文件和自带的函数引入 cssjs 的两种方法

    WordPress 引入css/js 是我们制作主题时首先面对的一个难点,任何一款主题都要加载自己的 css,js,甚至很有可能还需要加载 Jquery 文件,网上方法特多,说法不一,我们今天借鉴 wordpress...官方最新的 twentysixteen 主题来学习总结一下 WordPress 引入 css/js 各种常用方法,以及最优化的加载方法。...> 切记:如果一个插件将要用到你的样式表,或者你打算将在你的主题的不同地方进行加载,你绝对应该先注册。...> 告诉 WordPress 需要加载 jquery.jsWordPress 在 wp_footer() 中处理的时候也会先检查前面是不是已经有了,如果有了就不会再重新加载一次。...添加动态内联样式:wp_add_inline_style() 如果你的主题有选项可自定义主题的样式,你可以使用 wp_add_inline_style() 函数来打印内置的样式: function mytheme_custom_styles

    1.7K30

    WordPress移除head头部js、css、feed等多余加载

    在我们开发WordPress主题时,细心的小伙伴或发现网站头部如果加载head页面就会出现很多系统自带的加载项目,例如自带的css、js、feed、style等多余信息。...这些加载项目很多是没有必要加载的,那么我们如何将这些多余的head头部信息移除呢? 方法很简单,网上针对此类WordPress优化的教程也很多,今天WPTOO教程网就给大家整理下。...我们先看看移除多余加载项之前的代码截图 解决方法 //去除头部多余加载信息 remove_action( 'wp_head', 'wp_generator' );//移除WordPress版本 remove_action...rest_output_link_wp_head', 10 ); remove_action('wp_head','wp_resource_hints',2);//移除dns-prefetch 使用方法 将上面代码添加到主题的...head头部是不是少了很多多余加载项信息? 下面是精简后的代码截图 ?

    2.6K20

    WPJAM「静态文件」:一键合并 WordPress 插件和主题JS 和 CSS 文件,加快页面加载速度

    前端网页代码就变的很乱,如果 JS 或者 CSS 文件多,还会影响前端的加载速度: 以 Sweet 主题为例,从上图可知,有留言点赞的 JS 代码,主题自带的脚本代码,WPJAM 内容模板的 CSS...分别合并成一个文件:这样就实现前端代码简洁,并且相关的文件也变少,网页加载速度也会明显变快,还是以 Sweet 主题为例,合并之后,整个页面除了 jQuery 之外,只剩下合并生成的 JS 和 CSS...用户管理 最强 WordPress 一键用户管理插件。 支持自定义头像,屏蔽个人设置,优化姓名设置, 隐藏登录名,限制登陆失败次数,防止密码被暴力破解等功能。...配置器 全自动 WordPress 配置器,不用一行代码就可以开发。 支持自定义文章类型,自定义字段,自定义分类,分类选项,全局选项。...Script Loader 通过恢复 WordPress 联合加载方式来优化 WordPress 后台脚本加载。 外部链接 将文章或评论中的外部链接加上安全提示的中间页。

    7K30

    WordPress 主题和插件的加载运行机制、Hook钩子与重要函数

    本文有助于你深度了解 WordPress 主题和插件的 PHP 加载顺序,学习 Hook(钩子)Action(动作钩子) Filters(过滤钩子)的概念,弄懂 WordPress 重要函数:do_action...这段代码会将已激活的插件作为循环元素进行循环,对每个插件执行注册和加载。 继续向下看,会在第 421 行看到这样一段代码,该代码实现了加载我们激活的主题的 functions.php 文件。...这样,我们在主题中添加的功能,也会被加载到系统当中去。 这个文件没有再引用其他的文件,然后返回 wp-config.php。...结论 经过上述的分析可以得出一个结论,WordPress加载是这样的一个顺序,先加载 插件,再加载 主题根目录中的 functions.php,最后加载主题。...我们写插件,就是写一些自定义的函数,然后利用 WordPress 提供的对 Hook 操作的函数,将函数挂载到对应的位置上去。

    1.3K10

    如何删除渲染阻止JS 和 CSS以提高网站速度

    虽然网站的美感很重要,但它的内容和加载速度会让人们回访。WordPress 为用户提供了一个复杂的插件和主题工具箱,可以快速创建他们自己的自定义网站。...image.png 但是,这些主题和插件需要 JavaScript (JS) 和级联样式表(CSS) 才能工作。WordPress 以脚本文件的形式自动创建它们。它们通常优化不佳。...这使代码更加简洁和紧凑,最终减小了脚本的大小并增加了网页的加载时间。 W3TC 之类的插件和工具具有缩小主题中的 JavaScript 和 CSS 的模块。...这将使网页加载速度更快。 5. 消除所有不必要的脚本 JS 和 CSS 的目的是将功能扩展到网页,并在 HTML 不能的地方添加逻辑。...然而,HTML 5.3 带来了新的标签,这将使一些 CSS 和 JS 操作变得不必要。使用 HTML 而不是脚本自然会使您的网页加载速度更快。 因此,优化网站速度的最佳方法是消除所有未充分利用的脚本。

    3K20

    如何美化自己的博客,wordpress 主题编辑入门教程。

    学习本文的知识前提:略懂html和css,已经能搭建一个wordpress的博客。搭建不会的请看我的《关于配置lamp和wordpress》。...第一步的感觉就是,字体太大了,一个版面只能放几个文章, 对于初学者而已,在使用wordpress中,首先是把后台所有的选项和设计的全部都试一遍。把一切自定义小工具都配置到自己喜欢的样子。...从中一个个找下去,看到关于背景颜色的,可以看出原来主题的文章框是白色背景的,我们找到那句话看看是处于哪一个类中,把那一行复制下来,转到后台编辑样式表的界面,开始查找,ctrl+f,弹出查找框,粘贴复制的代码...这个不是问题,只要加载时间不超过两三秒就可以接受,但是也可以看到有两个资源是无法加载的,哪个是你的头像问题,因为这个资源被墙了,,导致你的博客会不断处于加载中,这个其实很好解决,直接不显示任何头像就可以了...原创文章,转载请注明: 转载自URl-team 本文链接地址: 如何美化自己的博客,wordpress 主题编辑入门教程。

    3.5K10

    WordPress 开发之让浏览器自动加载最新的CSS、JS文件(免刷新缓存)

    在开发WordPress 主题的时候,如果频繁更新主题的CSS、JS文件但主题已经上线,如何让访客的浏览器获取最新的CSS、JS文件而非等到浏览器删除缓存后?下面就介绍一个简单的方法。...v=2 但是,在WordPress 中如果每修改一次就要手动更新版本号那太累了。如何让版本号自动更新(即?v=后面的数字自动更新)? 时间戳 ? ? 想必你也知道了,用时间戳代替版本号。...>" /> WordPress 中呢? ? ? 有过WordPress 主题开发经验的都知道,WordPress 中引用主题的styl.css 文件的路径是直接使用函数<?.../css/style.css', NULL, filemtime($css_file) ); } js文件的话依照上面的照搬即可实现。...如此一来,就能保证浏览器每次访问都是最新的css、js文件,而非采用缓存。 本文参考国外网站paulund,感谢原作者!如有错误,欢迎雅正!

    5K100

    WordPress 开发之让浏览器自动加载最新的CSS、JS文件(免刷新缓存)

    在开发WordPress 主题的时候,如果频繁更新主题的CSS、JS文件但主题已经上线,如何让访客的浏览器获取最新的CSS、JS文件而非等到浏览器删除缓存后?下面就介绍一个简单的方法。...v=2 但是,在WordPress 中如果每修改一次就要手动更新版本号那太累了。如何让版本号自动更新(即?v=后面的数字自动更新)? 时间戳 ? ? 想必你也知道了,用时间戳代替版本号。...>" /> WordPress 中呢? image.png 有过WordPress 主题开发经验的都知道,WordPress 中引用主题的styl.css 文件的路径是直接使用函数<?.../css/style.css', NULL, filemtime($css_file) ); } js文件的话依照上面的照搬即可实现。...如此一来,就能保证浏览器每次访问都是最新的css、js文件,而非采用缓存。 本文参考国外网站paulund,感谢原作者!如有错误,欢迎雅正!

    4.7K80

    Wordpress网站加载速度优化

    二,wordpress网站打开速度慢的一部分原因 1.所购买服务器不在营销目标国家,服务器配置低 2.使用的模板过于繁重 3.过度使用wordpress插件 4.同个页面大量图片,所有图片同步加载,上传不压缩等...非首屏图片懒加载,将网络带宽留给首屏请求。 页面渲染: 1. 将 CSS 样式写在头部样式表中,减少由 CSS 文件网络请求造成的渲染阻塞。 2....将 JavaScript 放到文档末尾,或使用 async 方式加载,避免 JS 执行阻塞渲染。 3. 对非文字元素(如图片,视频)指定宽高,避免浏览器重排重绘。 网站架构: 1....主题模板 3.尽量使用代码解决wordpress独立站功能需求(先行百度谷歌,无需自己敲代码) 4.提前安装smush插件,在线使用http://tinypng.com压缩图片在上传到网站 5.网站尽量多些文本内容...,小些特效,图片等 6.使用w3 total cache,WP Fastest Cache,autoptimize插件充分利用缓存,压缩js,css等​ 7.购买cloudflare网站等cdn技术,优化网站打开速度

    1.2K40
    领券