主题

WordPress 中文团队起用了一款红色具有中国风的主题。由 5key 设计，e-xia 帮忙 code。效果请点击 WordPress 中文团队。 标签：WordPress 中文 WordPress 主题

你的 WordPress 主题是免费的主题，还是自己设计的？你想有一个独一无二的主题，但是不会 Photoshop，其实这些都不是问题，Hidden Pixels 为你收集了 6 个最佳的 WordPress 主题生成器 templatr templatr 是一个模板生成器，你可以用它在线为你的博客创建独一无二的设计，使用它你不需要任何 HTML 的背景知识和特殊的工具，你所需的只是浏览器，可能还需要一些创造力或者一些博客设计的想法。通过它，你只需要几下简单的点击就能下载到你完成的模板。 WordPress Theme Generator 这个在线生成器不需要你任何 HTML，JS，PHP 或者 CSS 背景知识就能够创建一个独一无二的 WordPress 主体。 修改颜色，设置，布局，在线预览，点击保存，下载你的模板，解压缩，上传，设置。好了，你就完成了给你的博客设计了一个全新的主题。 WPPAL 通过编辑已有的 WordPress 主题来生成你自己的主题。 Kalkran 一个主题生成器，他让你输入常规的模板代码（全为 HTML），然后生成一个基本的 WordPress 主题， 支持 Widget，含有存档页面模板，留言页面等等。 WordPressthemegen.com 一个 WordPress 主题生成器桌面程序，这个软件能够让你释放你创造性的想法并是你的 WordPress 主题变为现实 ThemesPress ThemesPress 是一个能够自动把你的已经编码为 HTML 和 CSS 的设计转换为 WordPress 主题，它能够让你完全控制你博客的样子，而不需要任何懂 PHP。 翻译自 Best […]

4月10号是西方的复活节，至今我还搞不懂这个节日是干什么的，我的感觉就是一些香港的朋友这天可以放假。 不过西方人总是喜欢在节日的时候发布一些免费的东东给大家用，如 TemplateMonster 这个模板销售商就发布了一款免费的基于复活节主题的 WordPress 主题。这个主题是三栏的，以草绿色为主色调，并以复活节彩蛋作为主要设计元素，还有一个复活节彩蛋的 RSS 订阅图标，设计的很棒，非常有意思。 下载：复活节 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 主题系列教程 的第一篇。 从零开始制作 WordPress 主题的教程不会一次就教会你所有的东西，那样也是不可能的，这个教程也不是 WordPress 主题制作的参考，我所做的是一步一步从零开始教你如何制作 WordPress 主题，所以一定要耐心。 所以这一篇介绍首先是 WordPress 主题制作的一个最基本的介绍。这里会涉及到 HTML 和 WordPress 的基本规则，一些专业术语，以及 WordPress 主题的层式结。这些概念是很重要的，在接下来教程的很多地方都会涉及到，所以开始之前一定要搞清楚。 基本规则： 规则 #1：以正确顺序关闭所有 HTML 标签。 在上图中在错误关闭标签的演示中，关闭的 ul 标签是不按次序的。 每个 HTML 标签都是在 < 和 > 中，如果有斜线 /，则说明这个标签是开始标签，没有则是结束标签。如：<> 是开始标签，而</> 是结束标签。 在上面的例子中，使用 ul（无序列表）li （列表元素）标签。注意 li 的开始和结束标签在 ul 的开始和结束标签的里面，这就是标签正确嵌套方式。 规则 #2：每个主题至少要有这两个文件 – style.css 和 index.php。index.php 告诉主题中所有的元素如何布局，style.css 则告诉主题中所有的元素该如何展示和样式。下面是一个完整的主题含有的文件列表（现在我们不用详细了解这个列表每个文件的意思，有个这样的印象就可以了）： […]

模板文件（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 教程

调用博客日志的主循环（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 主题系列教程第五篇的第二部分，在这篇中，我们将展示如果显示博客日志的内容，并且使用一个 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 主题系列教程的五篇的第三部分，今天我们将开始讲解日志的元数据（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 主题系列教程的第六篇，这一篇我们主要讲解 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 主题系列教程的第六篇的第四部分，尽管这篇的题目是 搜索框（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 和 […]

窗体化侧边栏是从零开始创建 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 […]

尾部（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 教程