wordpress主题制作菜鸟教程之常用代码篇

上篇文章感觉贴的代码太多了?对于初学者来讲,尽管可能有注释,但看起来仍然有点费劲吧?而且,接下来制作主题其头部分还会有不少代码,所以今天我还是花点时间,把基础性代码尽可能的都分析一遍,包括基本的html语句以及wordpress主题制作中常用的php代码。

还是再回顾一下html语句,由于现在html语言的版本已经发展到了html5,所以我们这个基础性主题也与时俱进,大量引入html5的语法标记;什么是html5语法标记?前面讲过了,语法标记可以想象成不同类型的小拼图,他们都是完整网页这个大拼图的组成部分。

早期版本的html语法标记常用的有div、p、span、h1、h2、h3、h4等,这些都是我们做主题用的较多的“小拼图”,而html5这个高版本的html语言新引入的语法标记有header、section、article、aside、footer等,他们属于新开发的“小拼图”,至于这些不同类型的“小拼图”有什么区别呢?大家还是看看前面我们那个彩色的网页结构示意图吧,看图会理解的更深刻。

制作主题的时候,常常需要调用css文件,以及javascript(js)文件到主题中,调用的位置在header.php文件的最顶部head部位,大家可以去上一篇基本框架日志的代码里面看看。下面重点分析一下css和js文件调用的规范性语句。

调用不同的css文件统一使用下面的语句

<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/style.css" />

这个语句的意思是,将当前主题文件夹中的style.css调用到浏览器进行使用,所有调用css文件都需要使用上面的规范语句,需要修改的只是css文件的名字,以及你的css文件的具体位置。比如要调用good.css文件,而这个文件没直接放在主题文件夹中,它放在主题文件夹里的一个叫做css的文件夹里面了,那么请看对应的语句写法如下

<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/css/good.css" />

仔细看一下,发现区别了么?肯定能看出来的吧!!

再看调用js文件的规范性语句写法

<script type="text/javascript" src="<?php bloginfo('template_url');?>/jquery-1.7.2.min.js"></script>

这个语句的意思是,将当前主题文件夹中的jquery-1.7.2.min.js问价调用到浏览器进行使用,同理,所有调用js文件的语句也都要照葫芦画瓢的使用。

有心人对比一下css和js调用语句的区别和联系吧,一个用link标记,而且没遵守有始有终原则;一个用script标记,严格遵守了有始有终原则,到底什么原因?我也不懂,哈哈,其实懂不懂没关系,关键是会用就行了。还有一点区别,就是在调用文件路径的时候,css使用了href标记,而js使用了src标记,这个也是记住就行啦。

相同点发现了没有?文件路径的表示是一样一样的,都使用了一个php语句添加到了文件路径中,文件路径你应该知道啥意思吧?看看下面这个php语句,这个可是很常用,尤其是表示文件路径的时候。

<?php bloginfo('template_url');?>

这个语句代表的是当前所用的wordpress主题的主题文件夹的路径,所以当你调用这个主题里的任何文件或者图片的时候,直接把这个语句插入到href或者src标记里面就行了;当然,能够获得当前主题文件夹路径的php语句还有几个,但我习惯用这个,其他的你可以自己去学习下。

通过上面的例子,也佐证了我的一个观点,就是制作wordpress主题其实懂不懂php都没关系,你只要能找到恰当的php语句就够了,然后把这个语句插入到适当的位置即可。有人要问了,我怎么知道什么时候插入什么php语句?嘿嘿,你不会跟别人学吗?当然,跟着我的文章学时最省事的了;还有一点让人高兴的是,如果只想做一个基本功能的主题,用到的php语句也不过十几个吧,大概,反正不多。

预告一下,下一篇文章要制作index.php文件,里面将用到以下几个php语句,先给大家温习一下。

<?php the_title();?> //这个语句输出文章的题目

<?php the_author_posts_link(); ?> //这个语句以超链接的形式输出文章的作者

<?php the_time('Y-m-d'); ?> // 以阿拉伯数字的格式输入文章的日期,如2012-04-23

<?php the_category(); ?> //以超链接形式输出文章所在的分类

<?php the_tags();?> //以超链接形式输出文章的标签

<?php comments_popup_link('抢沙发','抢地板','%条评论'); ?> //输出评论数目

<?php the_content();?> //输出文章全文

over,累坏了,今天就到这里,这些内容足够消化一阵的了吧?

回复

  1. 微果网 的头像

    前三个语法是空的 楼主 怎么没有内容啊 。。。。

    1. 啄木游弋 的头像
      啄木游弋

      你是说看不到代码?我刚查看了一下,能看到的啊。或者你稍微等等,刷新一下呗。

  2. 睡着的水 的头像

    我也去试试做做

    1. 啄木游弋 的头像
      啄木游弋

      follow me ,please。哈哈,虽然我也不是什么专业人员,瞎折腾着玩呗

  3. WZL 的头像

    我也研究过主题,无奈的是实在懒得弄css,还是人太懒了啊,

    1. 啄木游弋 的头像
      啄木游弋

      css很有趣的,就像一支神奇的画笔,在方寸之间显神通。

      1. WZL 的头像

        是人太懒了。。记不住那么多属性,js出于工作需要不得不记。。。。 有时间想你请教css,嘿嘿

        1. 啄木游弋 的头像
          啄木游弋

          互相探讨。我才是纯粹业余选手,你懂得js呀?一直觉得js才是真正高级的东西。恩,常常交流吧

  4. suN 的头像

    参见师兄!

    1. 啄木游弋 的头像
      啄木游弋

      师弟好听话,嘿嘿,欢迎常来看看哟。

      1. 睡着的水 的头像

        你们两个怎么成师兄弟了啊,难道大师兄和二师弟的故事啊?

        1. 啄木游弋 的头像
          啄木游弋

          他是小本科生,我是老研究生,就成了师兄弟了。大师兄和二师弟?必须不是

发表回复

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

You may also enjoy…