在编写WordPress主题中,如果第三方提供的HTML/JS/CSS文章中,包含了很多.js文件,在引入这些JavaScript文件过程中会这样那样的错误,比如什么“$ is not a function”之类的,这时候可以通过以下方式来一一排查。

 

1.正确在functions.php中引入jquery

在WordPress中jQuery文件是系统自带的,所以即便主题文件中有jquery.js文件,也无需特意用路径的方式引入,只需要添加这行代码就好:

wp_enqueue_script('jquery');

 

2.确保其他的JavaScript文件,都先引入了jquery文件。

所谓‘其他的JavaScript文件’是指第三方的文件,比如幻灯片JavaScript文件、弹出框JavaScript文件等,这些文件都需要先确保jquery文件加载完毕后,才能争取执行,所以先‘先加载jquery文件,然后执行xxx.js文件’的方式是:

 

wp_enqueue_script( 'xxx', get_template_directory_uri() . '/js/xxx.js', array('jquery'));

 

 

 

3.如果你自己编写了JavaScript文件,那么在你的文件开头和结尾,用以下代码包裹起来:

jQuery(document).ready(function($) {
//你的代码
});

 

 

4.如果还是出现’$ is not a function’的问题,估计就是有冲突了,可以在出现冲突的文件顶部加以下代码:

 

var $ = jQuery.noConflict();

 

 

 

专业网站开发网页设计公司

深度阅读:

wordpress主题制作开发实战教程3.7 – 在模板文件中分解代码 目前我们的主题已经步入循环,现在需要将主题分解至各个模板文件,以确保主题所有部分的编辑可用。这里有一个好的规则建议:首先,避免重复的标记其次,懂得标记独一无二的代码标签,使其仅仅出现在特殊的页面,比如首页 Header.php、Footer.php、...
wordpress主题制作开发实战教程3.10 – 新建Footer.php文件 新建Header.php文件 我们使用与sidebar和header相同的步骤创建footer的页面模板1.在主题模板中创建一个Footer.php文件2.打开你的Index.php文件,剪切你的footer文件,该文件通常位于
标签中至
WordPress主题制作开发实战教程4.2 – 导航栏功能 网站中使用导航栏是为了让访客能够清晰明了地找到网站相应的板块内容。在网站建设中导航栏是非常常见并且有效的。 1.先引入导航栏功能 在主题文件夹中创建一个functions.php的文件然后在开头添加如下代码:
WordPress主题制作教程2.3-WordPress 模板标签 主题中使用模板标签从数据库中检索内容,内容可以是博客标题或侧边栏的内容。模板标签是将内容放入主题的首选方法,因为:他们可以打印动态内容; 他们可以用于多个主题文件; 他们可以将主题分为更小,更易理解的部分。    什么是模板标签?  ...
WordPress主题制作教程2.5-WordPress的CSS和JavaScript 在创建主题时,当你将文件主题启用后,你会发现页面中的所有css/js代码加载失败,如下图所示。这是由于wordpress本身加载样式表/js文件有它自己的规则。 下面WP花园洋葱将带领大家使用标准的WordPress方法加载脚本和样式表。向WordPress添加脚本和样式非常简单。你...
WordPress主题制作开发实战教程4.1- 站点设置,固定链接设置 在本章节中,我们将带领大家去学习WordPress主题的站点设置,固定链接设置 站点设置 有时我们需要将我们网站的一些基本信息在网站上显示出来,比如网站标题,网站介绍,邮箱地址等,让人更加的了解这个网站,所以我们需要添加站点设置功能。在后台设置网站信息,在前台页面显示则需要在想显示的页面...
wordpress主题制作开发实战教程3.1(2)- 主题制作基本流程及一些小功能 在学习了上一节的WordPress主题基础之后,在本章节我们将学习主题制作的基本流程以及一些小功能。基本流程:1.创建主题文件夹2.创建主题模板文件3.模板文件引入css小功能:显示作者,时间,评论数量等 主题制作基本流程 创建一个主题,首先我们需要的是一...
WordPress主题制作教程2.2-WordPress 主题文件 虽然WordPress主题只需要两个文件(index.php和style.css),它们通常由许多文件组成,本节将向您展示如何整理文件。    主题文件和文件结构  默认的二十个主题是主题开发最好的例子。  assets - css ...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.