WP Super Cache 是 WordPress 官方开发人员 Donncha 开发,是当前最高效也是最灵活的 WordPress 静态缓存插件。它把整个网页直接生成 HTML 文件,这样 Apache 就不用解析 PHP 脚本,通过使用这个插件,能使得你的 WordPress 博客将显著的提速。 WP Super Cache 基本介绍 WP Super Cache 是基于 Ricardo Galli Granada 的 WP-Cache 2。WP-Cache 2 可以缓存你的 WordPress 博客使得不用再次访问数据库,但是它产生的是 PHP 文件而不是 HTML 文件,所以还需要 PHP 引擎去解析它们。而 WP Super Cache 则直接产生 HTML 文件,所以服务器不用解析甚至一行 PHP 代码,所以缓存之后的速度就和访问你服务器上的一张图片一样快。 WP Super Cache 是如何工作的 一半常规的缓存办法是手工把动态页面保存为 […]
2014
WP Super Cache 技巧:实时更新首页
WP Super Cache 是我推荐的最佳 WordPress 缓存插件,它把整个页面直接生成 HTML 文件,这样 Apache 就不用解析 PHP 脚本,通过使用这个插件,能使得你的 WordPress 博客将显著的提速。 如果 WordPress 的首页显示的不是最新日志,而是一个页面,并且这个页面包含实时更新的部分,如我爱水煮鱼的首页包含最新日志,那么就会存在一个问题,那么这个页面就不会实时更新。 这里我提供一个技巧,可以让你在使用 WP Super Cache 的这个静态缓存插件提速的同时,也能够让首页实时更新,WP Super Cache 是通过 wp_cache_post_edit 这个函数来编辑缓存的,它的参数是日志或者页面的 ID。 所以我们首先获取用于显示首页的页面的 ID,然后在日志更新或者删除的时候,或者有新留言的时候(如果首页没有包含最新留言,这个可不必),刷新首页。所以大致的代码如下: <?php add_action(‘publish_post’, ‘refresh_front_page’, 0); //发布或者更新日志时候刷新首页 add_action(‘edit_post’, ‘refresh_front_page’, 0); //有新留言或者留言被删除的时候刷新首页 add_action(‘delete_post’, ‘refresh_front_page’, 0); //删除日志时候刷新首页 add_action(‘publish_phone’, ‘refresh_front_page’, 0); //通过 email 发布日志之后刷新首页 function refresh_front_page(){ $front_page_id = […]
5个简单的步骤把 WordPress 打造成 CMS
可能网站的首页一直是一成不变的博客样子,有时候也会挺闷的,个人觉得首页就是应该把博客中最好最重要的内容展现给读者,基于这个想法,我把我爱水煮鱼的首页做了简单的改版,制作了一个非常简单的 CMS 首页。 基于 WordPress 的强大功能,这样的修改是很简单,根本不用大改主题,根本不用动主题的 index.php 文件,只需要创建了一个页面,然后在 WordPress 后台把这个页面设置为首页就可以了。 下面是具体的详细设置过程,只需要 5 个简单的步骤把 WordPress 打造成 CMS: 创建一个名字为“首页”的页面作为网站的,并给它的 Order(页面顺序)设置为 0。如果你的首页是需要定制的,比如我爱水煮鱼的首页没有侧边栏,分成各个板块,那么你需要专门为你的首页创建 WordPress 页面模板,并且把该页的 Template 设置为该模板。 创建一个空的页面,命名为“博客”,并且把他的 Order(页面顺序) 设置为 99(如果你没有很多页面,那么 99 基本就排到最后了)。这个页面到时候将作为的原来日志列表的首页。如现在的我爱水煮鱼的博客页面。 到 WordPress 后台,选择 Setting(选项) > Reading(阅读),将上面创建的 “首页” 作为 Front Page(起始页) 和 “日志” 作为 Posts Page(日志列表页)。 通过这个函数 wp_list_pages(’sort_column=menu_order&title_li=’) 创建网站导航菜单。这里使用了 sort_column=menu_order 这个参数就是让所有页面按照前面定义的 Order(页面顺序)排序输出。 进行更多的定制化工作,这个根据个人需求进行修改。当然你也可以找专业人士帮你定制和修改 当你创建其他页面的时候,让其他的页面的 Order 在 0 […]

如何在 Windows 系统上安装 WordPress 本地测试
我们在测试主题或者插件的时候,如果在服务器上测试的话,速度相对来说很慢,而且也不容易修改代码。这里给大家简单的讲一下如何在 Windows 系统上安装 WordPress 来做本地测试。 首先,你必须有一个基于Apache、MySQL、PHP 的编程调试环境。我们推荐使用 XAMPP,你可以从 XAMPP 官方网站:下载 XAMPP。 安装好 XAMPP 以后,打开服务器,将 Apache 和 MySQL 两个服务打开。如下图所示: 打开 Apache 和 MySQL 下载最新版的 WordPress ZIP 文件夹,解压并存放在 C:\xampp\htdocs 目录下。 当你第一次使用 WordPress 的时候,我们要创建 MySQL 数据库用于安装 WordPress。我们所需要做的就是在浏览器上输入:http://localhost/phpmyadmin/。进入数据库管理界面。选择 utf8_unicode_ci 和 utf8_general_ci 作为数据库格式,数据库名可以自定义: 创建 WordPress 数据库 在网页上打开 http://localhost/wordpress/,点击 create a wp-config.php file 链接,然后根据后面的步骤输入数据库信息创建 wp-config.php 这个 WordPress 数据库配置文件。 创建WordPress 数据库配置文件 创建好 […]
WordPress 主题教程:从零开始制作 WordPress 主题
从零开始制作 WordPress 主题其实不难,只要你从现在开始认真阅读这个教程,一步一步认真学习,你就会成为一个 WordPress 主题制作高手。至少你会修改现有主题。 网络上已经有很多关于制作 WordPress 主题的教程,并且 WordPress 官方网站上也有指导文章。但是当你不懂这方面的术语的话,这些教程可能不一定会帮助你,甚至还会误导你,所以这个教程会真正从零开始教你如何创建 WordPress 主题。 创建 WordPress 主题所需的工具和准备 开始真正制作主题之前,你需要使用到下面这些工具: 为了测试方便和快速,你首先需要在本地安装 WordPress,至于如何在 Windows 系统上安装 WordPress,你可以参考这篇日志:在 WordPress 本地安装 WordPress。 如果由于某种原因不能在本地安装 WordPress,那么你也可以的服务器上安装一个测试版的 WordPress。这个时候你必须要有一个支持 WordPress 主机的服务器,一般我使用 LAMP 主机(Linux+Apache+MySQL+PHP)主机,Win+IIS 主机可能会有很多问题,调试也比较麻烦,而 LAMP 主机,从我个人使用经验来说,我推荐 (MT) Media Temple 主机。 代码编辑工具,如 NotePad++ 或者 Vim 都可以,主要是适合自己个人使用习惯。 FTP 工具,用于上传主题到服务器上测试,这方面的工具很多,如 Filezilla,SmartFTP 等,如果你先安装软件麻烦(对啊,现在是云计算时代,谁还装软件),你也可以安装 Firefox 的 FTP 扩展,Fireftp,直接在 Firefox 中上传文件到服务器上。 XHTML 验证器和 […]

WordPress 主题教程 #1:介绍
WordPress 主题教程 #1:介绍是从零开始创建 WordPress 主题系列教程 的第一篇。 从零开始制作 WordPress 主题的教程不会一次就教会你所有的东西,那样也是不可能的,这个教程也不是 WordPress 主题制作的参考,我所做的是一步一步从零开始教你如何制作 WordPress 主题,所以一定要耐心。 所以这一篇介绍首先是 WordPress 主题制作的一个最基本的介绍。这里会涉及到 HTML 和 WordPress 的基本规则,一些专业术语,以及 WordPress 主题的层式结。这些概念是很重要的,在接下来教程的很多地方都会涉及到,所以开始之前一定要搞清楚。 基本规则: 规则 #1:以正确顺序关闭所有 HTML 标签。 在上图中在错误关闭标签的演示中,关闭的 ul 标签是不按次序的。 每个 HTML 标签都是在 < 和 > 中,如果有斜线 /,则说明这个标签是开始标签,没有则是结束标签。如:<> 是开始标签,而</> 是结束标签。 在上面的例子中,使用 ul(无序列表)li (列表元素)标签。注意 li 的开始和结束标签在 ul 的开始和结束标签的里面,这就是标签正确嵌套方式。 规则 #2:每个主题至少要有这两个文件 – style.css 和 index.php。index.php 告诉主题中所有的元素如何布局,style.css 则告诉主题中所有的元素该如何展示和样式。下面是一个完整的主题含有的文件列表(现在我们不用详细了解这个列表每个文件的意思,有个这样的印象就可以了): […]

WordPress 主题教程 #2:模板文件和模板
模板文件(template files)和模板(template)是从零开始创建 WordPress 主题系列教程的第二篇。开始之前,你要确保你已经看过WordPress 主题教程 #1:介绍,否则你将无法理解在教程 #2 中使用的名词。 在WordPress 主题教程 #1:介绍中,我们已经学过了 WordPress 的两条基本规则和术语,而这篇将会深入讲解模板文件,模板,以及每个页面的结构。 WordPress 博客的每个页面是由多个模板文件组成的,下面是首页的例子: 在上图中,我们可以看出主题的 index.php 是由 4 个模板文件组成: header.php,index.php,sidebar.php 和 footer.php。 Header 模板文件: 通常在这个文件中包含博客的标题(title)和描述(description)。而且它们通常在整个博客中都是一样的。 Index 模板文件: 这个模板文件包含你的日志的标题,日志的内容(就是每篇日志的文本和图片)和日志的元数据 (元数据是每篇日志的额外信息,如作者是谁,日志发布的时间,在哪个分类下,有多少留言等等)。 Sidebar 模板文件 这个模板文件主要用于控制博客的页面列表,类别列表,存档列表,友情链接列表和其他一些列表。 Footer 模板文件: 像 header.php 模板文件一样,footer.php 通常不会因为页面的改变而改变,你可以在这里放置任何东西,但是通常是版权信息。 现在让我解释为什么把上面图片中的 index.php 所在的区域标为红色的。引文这块区域是会根据不同类型的页面而发生变化。 如果你在单一日志页面,这时候页面将会包含这四个模板文件:header.php,single.php,sidebar.php 和 footer。 原文:link 标签:WordPress 主题 WordPress 教程
WordPress 2.9 简体中文版发布
WordPress 2.9 终于发布,相比 WordPress 2.8,WordPress 2.9 版本新添了很多功能,如垃圾桶,内置图片编辑等,并且速度和效率方面也提高了很多,WordPress 2.9 主要新增的功能有: WordPress 2.9 新增功能 恢复/“垃圾桶”功能:这样当你不小心删除一篇日志或者留言,可以从垃圾桶中恢复回来,并且这样也避免了每次删除操作的时“你确定要删除吗?”的确认提示。 内置图片编辑器允许你裁剪,编辑,旋转,翻转,缩放图片。 批量插件升级和兼容性检查,这样就可以让你一次性更新10个插件,而不像以前每个插件都做一次升级操作,并且 WordPress 还提供了插件是否兼容当前 WordPress 版本的信息,这样可以让你更放心的升级插件 更容易嵌入视频,现在只需要你贴入视频网站的 URL 地址就可以神奇的自动转化成视频的嵌入代码。现在支持 YouTube, Daily Motion, Blip.tv, Flickr, Hulu, Viddler, Qik, Revision3, Scribd, Google Video, Photobucket, PollDaddy, 和 WordPress.tv,将来会支持更多视频网站。 WordPress 2.9 详细改进 2.9 还提供一些很贴心的功能和一些巧妙改进,所以会让你使用 WordPress 得更加流畅: 现在自动支持 rel=canonical,以便更好的 SEO。不需要安装插件来实现该功能。 支持自动数据库优化,通过在 wp-config.php 添加 define(‘WP_ALLOW_REPAIR’, true); 既可实现。 现在主题支持日志缩略图功能,这样对杂志性的主题尤其有用。 […]

WordPress 主题教程 #3:开始 Index.php
开始 Index.php 是从零开始创建 WordPress 主题系列教程的第三篇。在介绍了 WordPress 主题的一些规则和术语,以及对 WordPress 模板和模板文件了解之后,现在是开始动手创建 WordPress 主题了的时候。 在这篇中,你将要着手开始写 WordPress 代码。这里建议在本地电脑上安装 WordPress,而不是安装到服务器上,因为本地更方便测试。 第1步:打开 XAMPP 控制面板。 在 XAMPP 文件夹(通常是:C:\xampp),双击 xampp-control.exe 将会弹出一个新的窗口。单击 Apache 和 MySQL 的启动按钮。如下图所示: 启动之后你看最小化窗口了。 第2步:创建你的主题文件夹。 转到你本地安装的 WordPress 主题文件夹,应该在xampp/htdocs/wordpress/wp-content/themes。创建一个新的文件夹,命名为 tutorial。 第3步:创建 index.php 和 style.css 文件。 打开记事本或者你选择的文本编辑器,把 index.txt 这个文件中的所有内容都拷贝到你的记事本。保存为 index.php。 打开另外一个记事本,直接保存为 style.css 到相同的文件夹下. 现在有两个文件了: index.php 和 style.css. index.php 解释: 点击上面的图片查看大图。我会向你解释每个红色圆圈区域是什么意思。 Doctype – 指明你用哪种类型的代码来编码你的主题。这里你暂时还不用管它的详细意思。 […]

WordPress 主题教程 #4a:Header 模板
Header 模板是从零开始创建 WordPress 主题系列教程的第四篇。前面我向你讲解了如何安装和启动 XAMPP,安装 WordPress 主题以及介绍了 PHP 语言的最基本语言,这篇我们将继续 PHP 并学习如何调用博客的标题和链接。 尽量输入所有代码而不是直接拷贝我给你的代码,这样可以让你尽量记住你所学到的的。 第1步:打开 XAMPP 和主题文件夹。 打开 Xampp,然后打开上次创建的主题文件夹,xampp/htdocs/wordpress/wp-content/themes/tutorial。我们应该看到上次创建的两个文件:index.php 和 style.css。 index.php 和 style.css 文件的内容应该和index.txt 和 style.txt 一致。 第2步:打开 index.php 打开浏览器,转到 http://localhost/wordpress。因为上次安装了一个空白的主题,这时我们应该看到一个空白的页面。 返回主题文件夹并打开 index.php 文件。 到目前为止,我们已经打开了主题文件夹,浏览器和 index.php 文件。 第3步:调用博客标题 编辑 index.php 文件。在 <body> 和 </body> 这两个标签之间输入 <?php bloginfo(‘name’); ?>,然后保存它。 返回到浏览器并刷新。这时候我们应该能够看到博客的标题。博客的标题是 Demo Theme Development。 刚才发生什么了? 我们在网页的主体 (body) 之间加入了一行 […]
WordPress 主题教程 #4b:Header 模板 2
Header 模板 2是从零开始创建 WordPress 主题教程系列教程的第四篇第二部分。最后说一次,开始之前务必先读下前面的日志。这篇会完成 Herder 模板,并且开始介绍 DIV Box 模型。 第1步:开启 XAMPP 和打开 index.php – 启动 Xampp – 打开 Tutorial 的主题文件夹 – 打开浏览器,在地址栏输入 http://localhost/wordpress – 返回主题文件夹,用记事本打开 index.php 第2步:给博客的标题添加 H1 的标签 现在,index.php 的代码是: <a href=”<?php bloginfo(’url’); ?>”><?php bloginfo(’name’); ?></a> 给它添加 <h1> 和 </h1> 标签。H1 标签意思是标题一。HTML 一共可以有7级标题:H1,H2,H3,H4,H5,H6。按照默认,H1是字体最大而H6是则最小。 添加之后的的 index.php 文件是: <h1><a href=”<?php bloginfo(’url’); ?>”><?php bloginfo(’name’); ?></a></h1> 保存,返回浏览器并刷新。 […]

WordPress 主题教程 #5:主循环
调用博客日志的主循环(The Loop)是 WordPress 中最重要的 PHP 代码集,几乎所有的页面都会用到它。这也是从零开始创建 WordPress 主题系列教程的第五篇。 在开始继续学习之前,我们先复习下到目前为止学到了什么? 到目前为止,我们已经学到:: 规则,术语和 WordPress 主题的层式结构 每个页面有哪些部分组成 如何安装你的主题 如何调用博客的标题和把它做成一个链接 如何调用博客的描述和如何把 header 和其他部分分开 现在让我们开始第五篇:主循环(The Loop) 打开 Xampp,“tutorial”主题文件夹,浏览器,并且在浏览器中转到 http://localhost/wordpress,最后打开 index.php 文件。 下面应该是这时候 index.php 文件中的内容: 记住,为了学习这些代码,请尽量手工输入而不是拷贝和粘贴。 第1步:创建 container Div 在 header DIV 标签下添加一个 DIV 标签,并给它的 ID 赋值为 “container”,如下: <div id=”container”> </div> “container” 这个 DIV 标签是用把博客的主要内容和其他东西都区分开,比如 sidebar 和 footer 等。 第2步:输入主循环代码 在 […]

WordPress 主题教程 #5b:日志内容
日志内容是从零开始创建 WordPress 主题系列教程第五篇的第二部分,在这篇中,我们将展示如果显示博客日志的内容,并且使用一个 DIV 标签把博客日志的内容和日志的标题区分开。再次强调一次,上一篇关于 WordPress 主循环介绍的课程非常重要,你需要彻底明白之后才能继续学习。 下面开始这篇课程。首先还是打开 XAMPP,“tutorial”主题文件夹,浏览器并在浏览器地址栏输入:http://localhost/wordpress,最后打开 index.php。 第1步:使用 the_content() 函数显示日志内容 在日志标题代码下面输入:<?php the_content(); ?>。 保存并刷新浏览器,现在在日志标题下面看到了一些文本: 刚才发生什么了? 我们使用了 PHP 函数 the_content() 调用了 日志的内容。现在,日志的内容只是一长行的文本,一直到窗口的右边,因为我们还没有样式化它。还记得最开始说到的 style.css 这个文件吗?我们以后用它来控制所有页面元素的显示和布局。 我们在 WordPress 后台输入多篇多篇测试日志,就可以看到多篇日志一起被显示的样子: 返回浏览器,点击”查看”选择“页面源代码”,就会弹出一个源代码窗口,如果你使用的是 Internet Explorer,那么弹出的是记事本。 我使用的是 Firefox浏览器,下面是在 FireFox 中显示的样子: 你注意到 index.php 文件和它的源代码之间的区别了吗?所有的文本,图像和其他东西等所有上图展示的东西都是通过 the_content() 这个函数调用来的。是不是很有用?注意这些代码是不依赖具体的 WordPress 主题,我们应该自己的这些文本和图片进行编码和样式化。 还有,有没有注意到我圈出的开启和关闭的P标签。他们都没有在 index.php 文件中出现,但是他们在源代码中出现了。 P 标签,为什么和如何使用? 为什么 – 当我们输入日志的时候,每次跳过一行就是一个段落,这个时候需要一个方法去展示?我们可以通过 P (段落,paragraph)标签,每个段落会在 P 标签之间,这就是为什么段落之间有行距的原因, […]

WordPress 主题教程 #5c:日志元数据
日志元数据是从零开始创建 WordPress 主题系列教程的五篇的第三部分,今天我们将开始讲解日志的元数据(Postmetadata):日期(date),分类(categories),作者(author),评论数(number of comments),以及其他和日志有关系的信息。 同样请打开 XAMPP,主题文件夹,浏览器以及 index.php 文件。 先让我们复习下,现在的 index.php 文件应该有下面这些代码了: 把 postmetadata.txt 中的代码复制到 <?php the_content(); ?> 下面。(注意:在这部分,我们只需要复制和粘贴。当我制作 WordPress 主题的时候,我也只是复制和粘贴这部分代码。对于这部分代码,你不需要完全理解它,只要知道每部分干什么已经足够了。) 下面的屏幕截图是为了适应日志的大小而只裁剪了一部分,它主要你关注日志元数据代码的位置: 保存并刷新浏览器,现在应该是: 我们同样可以通过查看源代码来看日志元数据是怎样的? 详细解释: <p class=”postmetadata”> 和 </p> – 所有的日志元数据都在一个 class=”postmetadata” 的段落标签中,因为我想把日志元数据和日志内容区分开。如果没有段落标签,日志元数据信息将在日志内容结束的地方继续,这样就没有任何间距去区别内容和日志元数据。 <?php _e(’Filed under:’); ?> – : 是调用冒号“:”的代码; 把Filed under:放入<?php _e(’ ‘); ?>中不是必须的,这样主要为了使得 Filed under: 可翻译。如果你的主题不需要支持多语言,可以简单输入 Filed under:; <?php the_category(’, ‘) ?> – […]

WordPress 主题教程 #5d:Else,日志 ID,链接标题
Else,日志 ID,链接标题是从零开始创建 WordPress 主题系列教程的五篇的第四部分,这篇课程将讲解其他3个可以增加到日志中的元素:Else,post ID, 和 链接的 title 值。尽管它们是可选的,但是我们几乎可以在我每一个免费的主题中都能找到。 开始之前,不要忘记启动 Xampp。 第1步:Else 在 <?php endwhile; ?> 的下面输入以下代码: <?php else : ?> <div class=”post”> <h2><?php _e(’Not Found’); ?></h2> </div> 大致如下: 保存刷新浏览器,但是应该注意到没有任何变化。我们返回教程 #5 — 主循环,去解释你刚才上面输入的是什么? 这里就是主循环的部分代码: <?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?> <?php endwhile; ?> <?php endif; ?> 第一,if(have_posts()) 检查博客是否有日志, 第二,while(have_posts()) 执行 the_post() 去调用日志。而 Else […]

WordPress 主题教程 #5e:日志导航链接
日志导航链接是从零开始创建 WordPress 主题系列教程的第五篇的第五部,在绝大多数的 WordPress 博客的底部,都会有 下一页 (Next Page) 或者 上一页 (Previous Page) 这样的导航链接。我们可以通过 WordPress 的模板系统中的 posts_nav_link() 这个函数调用这些链接。 在 <?php endwhile; ?> 和 <?php else : ?>之间添加如下代码: <div class=”navigation”> <?php posts_nav_link(); ?> </div> <div class=”navigation”> – 开始一个名为 navigation 的 DIV 标签。 <?php – 开始 PHP 代码 posts_nav_link() – 调用后一页和前一页的链接。 ; – 停止调用。 ?> – 结束 PHP […]
BackPress:用于创建网页程序的 PHP 库
BackPress 是一个具有网页程序(或者说在线应用)核心功能的 PHP 库,它的是非常欢迎的 WordPress 开源程序的核心部分,也是 bbPress 和 GlotPress 等开源程序的核心部分。 它包括可用于创建强劲的,并可扩展的网页程序的基本功能: 登录(主要采用 bbPresss 的登录代码)到文件/数据库/其他。 用户角色管理 — 用户部分程序的访问控制 用户管理 — 包括用户的元数据(meta data)和数据库模式支持,用于管理核心的用户信息和其他相关的信息。 数据库抽象 — 支持使用多个数据库服务器,集群和数据中心 XML-RPC 服务器端和客户端 — 用于和其他系统交互。 邮件发送 — 通过 SMTP 和 sendmail,支持附件。 密码散列(Hashing)/加密 (Crypto) AJAX — 标准的基于 XML 的 AJAX 请求和 AJAX 响应。 用户身份验证 — 内置了密码加密,再加上安全的 cookie 管理 通过对象来进行错误处理 — 一次可处理多个错误。 完整的 HTTP […]

WordPress 主题教程 #6:侧边栏
侧边栏是从零开始创建 WordPress 主题系列教程的第六篇,这一篇我们主要讲解 WordPress 主题的侧边栏,让你很快掌握它的结构,并能编码和样式化它。 在开始侧边栏之前,这是现在 index.php 文件的样子。 第1步:创建 id 为 “sidebar” 的 DIV 首先让我们创建一个名字为 sidebar 的 DIV,这样可以把侧边栏中的所有东西都放入其中。在 container 的后面和 </body> 标签的前面输入以下代码: <div class=”sidebar”> </div> 第2步:给侧边栏的 DIV 添加无序列表 在新的 sidebar 的 DIV 标签中创建一个新的无序列表。 <ul> – 开始无序列表 </ul> – 结束无序列表 第3步:给这个无序列表添加原属 增加一个列表元素(LI)到无序列表(UL)的中间并把一个子标题添加到这个列表中。 <li><h2><?php _e(’Categories’); ?></h2> </li> 注意添加制表符到<li> 和 </li> 标签之前为了代码缩进。 <li> – 开始列表元素 <h2> – 开始子标题 […]

WordPress 主题教程 #6b:页面链接列表
页面链接列表是从零开始创建 WordPress 主题系列教程的第六篇的第二部分,通过上一篇的学习,现在已经熟悉了侧边栏的结构,接下来我们将继续修改侧边栏,完成页面链接(Page-link)列表。当完成常规的侧边栏之后,我们将学习如何窗体化(widgetize)侧边栏。 在分类链接上面添加以下代码: <?php wp_list_pages(); ?> 保存并刷新浏览器。效果如下所示: 在默认情况下只有一个页面链接,就是 About 链接。我在我的本地的博客增加了很多多页面和子页面,这样我就有四级页面链接。 查看页面源代码,我们可以看到 wp_list_pages() 产生的完整结构以及代码,如下: 第一,它把所有东西放入列表元素标签(LI),第二,它给列表一个名字,Pages。第三,它增加一个无序列表(UL)。第四,它把每个链接放入到 <li> 和 </li>标签之间。 在上面的截图中,注意到“Pages”这个列表标题和“Categories”这个分类链接标题的大小不一样。 如何使它们一致呢? 添加 ‘title_li=<h2>Pages</h2>’ 到 wp_list_pages() 作为参数。 保存并刷新浏览器结果如下: title_li 是一个用来定制化页面链接列表的标题的参数。<h2>Pages</h2> 是 title_li 这个参数的值 进一步定制化: 在我的例子中,我有四级页面链接。由于布局或者设计的原因使得不能在侧边栏处理那么多级别的链接。为了限制显示列表的层数,增加了 depth 这个参数,并把它设置为 3: 注意,我添加了 depth=3& 而不是仅仅 depth=3。这个 & 在这儿用于把 depth 和 title_li 这两个参数区分开。(如果你只有一个 about 页面链接,你将不会注意有什么不同。) 这里是我的列表的不同之处:(对比这个截图和上面的截图。) 原文:link 标签:WordPress 主题 WordPress 教程

WordPress 主题教程 #6c:存档和链接列表
存档和链接列表是从零开始创建 WordPress 主题系列教程的第六篇的第三分,这篇将比较简单,讲解如何调用存档链接列表和友情链接(blogroll)列表。 第1步 – 增加存档链接列表。 在侧边栏区域的 Categories 列表下面输入以下代码: <li><h2><?php _e(’Archives’); ?></h2> <ul> <?php wp_get_archives(’type=monthly’); ?> </ul> </li> 复制之后检查下代码是否和下面一样: 保存并刷新浏览器。结果如下所示: 发生什么了? 我们使用了 wp_get_arhives() 这个 PHP 函数,并用了 type 这个参数以及 monthly 作为它的值,这样就按月调用存档链接列表。 <li> – 开始列表元素 <h2> – 开始子标题 <?php _e(’Archives’); ?> – 子标题文本 </h2> – 结束子标题 <ul> – 开始在存档链接这个无序列表 <?php wp_get_archives(’type=monthly’); ?> – 按月调用存档列表链接,并把每个链接放入 <li> 和 </li> […]

WordPress 主题教程 #6d:搜索框和日历
搜索框和日历是从零开始创建 WordPress 主题系列教程的第六篇的第四部分,尽管这篇的题目是 搜索框(Search Form) 和 日历(Calendar),但是我同样也会介绍 元数据(Meta) 。这一篇我们会结束常规的侧边栏,然后将在下一篇将介绍如何窗体化(widgetize)化侧边栏。 第1步:增加搜索框 创建一个新文件,然后把该空白文件保存为 searchform.php(当然是和 index.php 在同一个文件夹下)。把 searchform.txt 中的内容拷贝到 searchform.php。 在 index.php 文件,在侧边栏的最顶部输入以下代码: <li id=”search”> <?php include(TEMPLATEPATH . ‘/searchform.php’); ?> </li> 保存并刷新浏览器,结果如下: 刚才发什么了呢? <li id=”search”> – 开始一个名字为 search 的列表元素,给它一个 ID,这样就能够以后样式化它。 include() – 导入任何你想导入的文件。这和使用 WordPress 模板函数去调用模板文件是不同的,因为 include() 只是简单导入已经存在的文件。这里是调用在 searhform.php 文件中的代码。被导入的信息应该在一个博客上基本不会被改变的。 TEMPLATEPATH – 主题文件夹的位置,这里是:wp-content/themes/tutorial ‘/searchform.php’ – 文件名:/searchform.php 在 TEMPLATEPATH 和 […]
bbPress 1.0 发布
bbPress 这款和 WordPress 同属一个公司的开源论坛程经序历多个 alpha, beta 和 RC 版之后终于发布了。 bbPress 1.0 版本在可用性上做了很大的改进,使得习惯使用 WordPress 的同学更加易于使用 bbPress,现在 bbPress 1.0 现在的后台管理界面和 WordPress 非常相类似,并且使用了相类似的描述和名字,并且现在也和 WordPress 一样在修改永久链接的时候可以自动产生 .htaccess 文件。 bbPress 1.0 改进的功能: 可以统计某个主题有多少人参与了讨论 现在 bbPress 自身支持和 WordPress 2.7 和 2.8 的 Cookie 整合,即可以实现在 WordPress 和 bbPress 单一登录。 支持 memecached 对象模式 支持时区 含有完整的 XML-RPC 发布 API 支持 Pingback — 论坛的每个主题和博客的日志一样都可以收到 pingbacks […]
bbPress 使用技巧
我前面对 bbPress 这个论坛程序做了详细的介绍,安装,中文包,以及解释了我为什么使用 bbPress,今天介绍下使用 bbPress 的一些技巧。这篇日志我也会长期保持更新,我会把所知道的 bbPress 技巧在这篇日志中分享,所以请保持关注,可以收藏这篇日志,IE 8 用户,还可以通过 IE8 的 Web Slice 功能订阅到收藏栏。 1. 支持图片 bbPress 默认情况下是非常简洁的,发贴的时候只能输入文本和支持一部分 HTML 标签,默认情况下是无法插入图片了,如果要在发帖的时候使用 <img /> 方式插入图片的话,则需要安装一个 Allow Image 插件。 2. 注册验证 默认情况下 bbPress 注册是没有验证的,这样只要通过一个简单机器程序就可以疯狂注册,这样会产生很多 SPAM 用户,所以我们应该安装一个注册验证的插件:Human Test,这个插件会让用户注册的时候做到数学题,只有答案正确才能通过注册。 3. 批量删除 Bozos 用户 Bozos 用户就是有问题的用户,通过机器手段注册的 SPAM 用户,这类的用户一般都要全部删除了,默认情况下,bbPress 只允许我们一个一个编辑,然后才能删除,这样显然非常麻烦, Delete All Bozos 这个插件就是来处理这个问题,它会一次性把所有 Bozos 用户删除。 4. 添加 Google Analytics 到 […]
我为什么使用 bbPress?
前面我对 bbPress 这个非常简洁易用的论坛程序做了一个简单的介绍,以及如何安装 bbPress 和其中文包,最后我用 bbPress 给 WordPress JAM(我们的 WordPress 项目网站)装了一个论坛,用于分享 WordPress 技巧和一些开源程序。 但是肯定很多同学使用了 bbPress 之后,肯定会觉得它太简单了,甚至一些所谓的论坛标配的功能都没有。但是为什么还使用它呢?下面我就谈谈我为什么使用 bbPress。 开源:bbPress 和 WordPress 一样是开源的,我们可以免费使用它,虽然网上有很多很强大的论坛程序,但是很多都是收费的,或者用在商用上的时候要收费。 简洁:首先 bbPress 代码非常简洁,这个保证了速度上有优势,另外 bbPress 在功能和界面上也非常简洁,比如在发贴的时候只能输入文本和只支持一部分 HTML 标签,甚至都需要安装一个 Allow image 的 bbPress 插件才能使用 <img> 才能插入图片。但是正是它的简洁,让我们可以舍弃了一些不必要的功能,利用 bbPress 强大的插件系统打造一个适合自己风格的论坛。 整合:bbPress 可以和 WordPress 整合,可以和 WordPress MU 整合,还可以和 BuddyPress 整合,成为 SNS 系统的论坛程序,并且保证了用户名统一等。如果你网站需要整合一个轻巧的论坛,那么 bbPress 是最好的选择。 标准:简介是美,标准也是美,bbPress 在这方面做的是最好的,它默认的主题不仅支持 XHTML 和 CSS […]
bbPress 介绍,安装和中文包
bbPress 介绍 什么是 bbPress? bbPress 是 WordPress 母公司 Automaticc 出品的一款开源论坛程序,它是一个符合 Web 标准,非常容易使用的轻量级论坛程序,由于 bbPress 保持了体积小,重量轻,所以速度非常快。bbPress 没有提供过多复杂的功能,所以你要安装一个轻量型的论坛,bbPress 是很好的选择。 对于有更多需求的用户来说,bbPress 也和 WordPress 一样提供了一个非常强大插件系统,让你添加各种功能扩充论坛。并且 bbPress 的 API 接口和 WordPress 也类似,同样是 Action 和 Filter 两种 Hook,如果你熟悉 WordPress 插件制作,那么你也会很快学会 bbPress 插件制作。 在使用方面,bbPress 和 WordPress 拥有基本相同的使用和操作方法,特别是 bbPress 1.0 版本之后,bbPress 后台管理界面和 WordPress 基本类似,使用了相类似的描述和名字,习惯使用 WordPress 的同学对 bbPress 应该很快能够上手。 bbPress 主要特点和功能 快速和轻量级 — bbPress 保持代码简洁,让用户得到最好的体验。 […]

WordPress 主题教程 #6e:窗体化侧边栏
窗体化侧边栏是从零开始创建 WordPress 主题系列教程的第六篇的第五部分,一个支持 Widget 的侧边栏或者说是窗体化(widgetized)的侧边栏几乎是 WordPress 主题的标准。 首先,什么是窗体化(widgetizing)呢?简单的说,窗体化就是能够通过拖拉就能够整理侧边栏的模块。比如我们需要更改分类和存档的位置,只需要简单把分类和存档列表拖到它们的位置即可,根本不用去修改侧边栏的代码。 第1步:创建 functions.php 文件 打开记事本,然后把空白文件保存为 functions.php。把 functions.txt 文件中所有的内容拷贝到 functions.php 中。 回顾一下,现在在“tutorial”主题文件夹下应该有4个文件。 第2步:窗体化侧边栏 直接在侧边栏的第一个 <ul> 标签输入以下代码: <?php if ( function_exists(’dynamic_sidebar’) && dynamic_sidebar() ) : else : ?> 直接在 </ul> 标签之前输入以下代码: <?php endif; ?> 保存 index.php 文件,然后我们到 WordPress 后台 => 外观 => Widget 就可以把 Widget 拖到侧边栏了。 原文:link 标签:WordPress 主题 WordPress […]

WordPress 主题教程 #7:尾部
尾部(footer)是从零开始创建 WordPress 主题系列教程的第七篇,这篇教程将会很简单,去只要在侧边栏下增加个 DIV 标签,然后输入一些版权信息。其实你完全可以不用我说明就能自己去做,可以先自己尝试下,然后返回这里再仔细检查下。 第1步:增加个 DIV 标签 在侧边栏的 DIV 标签下输入以下代码: <div id=”footer”> </div> 第2步:添加版权信息 把尾部的文本放入段落标签中,你可以输入任何你想要的东西,这里是我的: <p> Copyright © 2007 <?php bloginfo(’name’); ?> </p> 保存并刷新浏览器,结果如下: © 用于显示版权符号,还记得在 header 的时候使用的 bloginfo() 函数吗?这里再次使用,“name”是用于调用博客标题,而“url”调用博客的地址。 如果你想你的博客标题成为一个链接,查下头部就知道怎么做了。 原文:link 标签:WordPress 主题 WordPress 教程

WordPress 主题教程 #8:验证 XHTML
验证 XHTML 是从零开始创建 WordPress 主题系列教程的第八篇。在开始学习 CSS 并修改 style.css 文件之前,我们需要学习如何验证代码,简单说,验证(Validate/Validating/Validation)就是检查下代码有没有错误,而验证又分为:XHTML Validator 和 CSS Validator。这篇我们学到 XHTML 验证器。 首先打开 Xampp Control 和浏览器,并进入 http://localhost/wordpress。 然后查看 > 页面源代码。 全选并所有的源代码。 然后到 XHTML Validator。 把刚才复制的源代码粘贴到 Validate by Direct Input 框中。 点击 Check 之后,验证器会就会检查代码,然后把检测结果反馈给我们。如果反馈回来的结果是绿色的,那么代码没有错误。 如果有错误,则根据其提示进行修改。 原文:link 标签:WordPress 主题 WordPress 教程

WordPress 主题教程 #9:Style.css 和 CSS 介绍
Style.css 和 CSS 介绍是从零开始创建 WordPress 主题系列教程的第九篇,学习 CSS 最好的方法就是去使用它,不像 XHTML 和 PHP 需要接触模板的核心文件,同样不要需要理解任何基本概念,只要去用它,通过试用和修正错误是可以让你快速学会。 我们现在已经在 style.css 文件有些内容,让我们先来看看这部分内容是干什么的? 第一行显而易见就是主题的名字。 第二行是这个主题的地址,如果你的主题只是私用的而不准备发布的话,那就不用管它了。 第三行是主题的描述。 第四行是版本号,这是非常重要的,特别是当你公开发布你主题新版本的时候。 第五和第六行分别是主题作者的名字和主页。 在主题信息两边的 /* 和 */ 符号是为了让主题的信息不影响该文件的其他内容,这是 CSS 的注释。当输入 CSS 代码去样式化你的网页的时候,你可能想在这里增加些注释使得能够在以后更清楚知道这部分是干什么的。显然我们并不想你的注释影响实际的代码,所以可以使用 /* 和 */ 这一对符号使得注释不被解释。 下面是处理后的主题信息 第1步:打开 style.css 文件 打开 Xampp,主题文件夹,FireFox,IE 浏览器和 style.css 文件。 在两个浏览器的地址栏都输入:http://localhost/wordpress 从这里开始,我们需要同时在 FireFox 和 IE 上测试主题,不同的浏览器对 CSS 的代码解释是不同的。如果能够在尽可能多的浏览器器上和尽可能多的操作系统上测试你的主题是最好的(Safari,Opera,Linux,Netscape 等等)。如果你和我一样懒,那就只在 FireFox 和 IE 上测试你的主题吧。 […]

WordPress 主题教程 #10:十六进制颜色代码和样式化链接
十六进制颜色代码和样式化链接是从零开始创建 WordPress 主题系列教程的第十篇。这篇继续昨天介绍 CSS 的课程,我们今天将介绍如何着色和十六进制颜色代码。 颜色属性,跟着的是一个十六进制代码,是用于给文本上色。如 body { color: #000000;} 意思是你页面 body 内所有文本将是黑色的。 背景颜色属性,跟着的是一个十六进制代码,是给除背景上色。如 body{ background: #ffffff; } 意思是为 body 上白色背景。 十六进制代码 每个十六进制代码前都有 # 号,然后跟着六位数字。这些数字的范围是从 #ffffff(白色)到 #000000(黑色)。 #ffffff, #eeeeee, #dddddd, #cccccc, #bbbbbb, #aaaaaa, #999999, #888888, #777777, #666666, #555555, #444444, #333333, #222222, #111111 前两位表示红色,第三和第四代表绿色,而最后两位代表蓝色。#ff0000 是红色(red)。#550000 是暗红色(dark red)。 #220000 是更黑色的红色(darker red)。 #00ff00 是绿色(green)。 #0000ff 是蓝色(blue)。那么哪个十六进制代码是黄色呢? #ffff00 就是黄色(yellow)。 […]
WordPress 主题教程 #11:宽度和布局
宽度和布局是从零开始创建 WordPress 主题系列教程的第十一篇,这篇将介绍如何设置每个 DIV 的宽度和布局排版,并且也会展示如何让主题显示正确,并同时在 Firefox 和 IE 下兼容,显示一致。 在我们开始之前,打开 Xampp Control,主题文件夹,Firefox 浏览器,IE 浏览器,index.php和style.css这两个文件。 第1步:设置页面总体宽度 现在我们首先要确定的是主题的总体宽度。我们使用 750px;主题的大小取决于博客绝大多数访问者的屏幕分辨率。需要避免的是使用过大宽度的 的主题,如果博客的读者都大多数使用 800px × 600px 的屏幕,这样的话,如果是使用 900px 宽的主题将会有 100多像素超出他们的屏幕,显然这是对用户很不友好的。 不管怎样,我们怎么样把主题的总体宽度设置为 750px 呢? 我们需要把现在主题中的所有的东西(header,container,sidebar 和 footer)放入一个 750px 的 DIV 标签中。 在 <body> 之后增加:<div id=”wrapper”> 在 </body> 之前增加:</div> 在 style.css 文件中输入以下代码: #wrapper{ margin: 0 auto 0 auto; width: 750px; text-align: left; […]

WordPress 主题教程 #12:日志样式化和其他杂项
日志样式化和其他杂项是从零开始创建 WordPress 主题系列教程的第十二篇,这篇主要讲解如何样式日志,这篇不需要 index.php, 打开Xampp Control,theme 文件夹,Firefox,Internet Explorer 和 style.css 文件。 第1步:Reset CSS 在 style.css 文件中的 body{} 上面输入以下代码来处理大部分页边空白和填充: body, h1, h2, h3, h4, h5, h6, blockquote, p{ margin: 0; padding: 0; } 这里我们使用的是 margin: 0; 而不是 margin: 0 0 0 0;。因为所有的值都是一样的话,只用一个数字就够了,对于填充的设置也是一样的。 保存,刷新 Firefox 和 IE。接下来我们可以增加空白和填充到需要的地方。 第2步:样式化 H1 标题 在 body{} 之后输入以下代码: h1{ font-family: Georgia, Sans-serif; […]

WordPress 主题教程 #13:样式化侧边栏
样式化侧边栏是从零开始创建 WordPress 主题系列教程的第十三篇,这篇主要讲解如何样式化侧边栏里面的所有元素,在对侧边栏样式化之后,这系列教程就将差不多结束了。 打开 XAMPP,主题文件夹,Firefox,IE 和 style.css 文件。 第1步:样式化侧边栏的无序列表 在 .sidebar{} 下输入: .sidebar ul{ list-style-type: none; margin: 0; padding: 0 10px 0 10px; } 现在已经为侧边栏样式化父级无序列表(UL)标签。所有的子 UL 或者内嵌的 UL 将会击继承同样的样式。在这里,它是无列表样式,零空白和10像素的填充。 如下所示: 第二级的(或内嵌的) UL 继承了第一级 UL 的样式。如果你给了第一级 UL 应用了边框,第二级的 UL 同样也会有个边框。 保存并刷新就可以看到列表条目现在已经没有前面的圆点了。 注意下你是如何增加顶部和底部填充的。 第2步:给 LI 添加填充 在 .sidebar ul{} 下输入: .sidebar ul li{ padding: 10px 0 10px […]

