wordpress主题制作全教程哪位能给指点下{我会css+div和html}

还是报一门互联网课程学习一下把！

免费的就是最贵的（ps：你应该懂的），wordpress不像dz那样入门很简单，wordpress功能的修改涉及到的代码问题比较多。

想要开发出独一无二主题，只有自己熟悉wordpress，所以找个家（老师）学习一下把！

具体什么培训机构我就不推荐了！

如何用 WordPress 写出一篇“好看”的文章

一篇文章是否好看，无非在于两方面，第一个就是文章本身的内容，另一个就是文章显示的排版布局。笔者博客自创建以来，也已经过去了近两年的时间，这 其中积攒了很多在 WordPress 写作的经验，特别是在文字排版这块。回首观看，早期的文章质量比现在的要差远了，本文就是总结一下对于使用 WordPress 写作文章排版的经验。

一些基础知识

在后台编写文章通常使用可视化的编辑器，你看到的排版布局就是比较具体的效果，但实际上数据是用 HTML 结构来记载的。例如，当你回车换行，那么在换行的地方系统就会加上一个段落标签（p），当你插入一个连接的时候，用的就是锚标记 （a）。HTML 是具有语义性的，根据 HTML 的语义性写出的一篇文章，对于 SEO 、排版都有好处。此外，WordPress 主题的作者，通常也会针对这些结构进行一些设计和样式处理，会使其显示的效果更好。

用标题划分文章层次

标题标签（hn）是非常重要的一个 HTML 标签，它对于 SEO 也有很重要的作用。通常用它来划分文章的层次。写一篇文章，肯定要有一定的层次，也就是所谓的大论点、小论点等。通常的文章一般具有三个层次：文章标题、 大标题、小标题，通常来说，对应的标签是 h1、h2、h3。对于有的主题来说，设计者会用 h2 作为文章标题，这点也需要注意。标题标签一共有六个（h1-6），分别代表不同的重要等级，实际应用当中，只会使用 h1-3。需要注意以下两点：

内文标题层次不要高于文章标题。如果文章标题使用了 h1，那么内文大标题只能使用 h2。

小标题包含在大标题中。分清楚小标题属于哪个大标题属于什么层次，不能把小标题和大标题的层次混合。

合理的使用标题划分文章层次，可以让文章变得更容易理解，对阅读者和 SEO 都有好处，更有一些插件可以根据文章的标题建立目录层次，例如 水煮鱼 开发的TOC 文章目录插件。

对于重要的文字进行加重处理

这一点大家都知道，不再赘述。但是要注意的一点，只对非常重要的关键词进行加重，加重的效果通常是文字加粗，这样可以吸引浏览者的目光，如果太多的话，就会分散阅读者的注意力，要尽可能的少。下图就是个加太多的例子。

善用有序和无序列表

如果你在文中写的内容具有明显的并排性，可以作为一个列表，那么一定要使用无序列表（ul）或者有序列表 （ol）。无序列表就是指没有顺序的列表。如果你想列举某项产品有什么样的有点，或者是一些赛事列表，那么你应该使用无序列表。有序列表 是指一些有顺序的并排信息。如果你想写一下使用某个软件的四个步骤，或者是发布一个有明确顺序的资源列表，那么就用无序列表。

见过很多文章会对一些并排性的内容，手动编写诸如 1、2、3 之类的编号，其实这是错误的，应该使用有序列表， CSS 自动添加编号上去。

善用空格

空格是文章中比不可少的一部分，但是很多人用空格的方法是错误的。空格不是用来排版的，它不像是在 Word 之类的软件里面，使用空格在段落的开头空开两格。中文的写作习惯是在文章段落的开头，空开两个字符，这空开的距离，并不应该使用空格来实现，而是使用 CSS 对段落标签增加属性 text-indent 来实现的。这个是主题设计者的工作，如果你用的主题并没有做这个，那就不会自动空开了，你只能自己修改 CSS 或者用空格模拟空出两字的效果，但这是不合理的。

那么空格究竟要用在什么地方呢？用在重要的关键词上面，特别是英文关键词。英文在中文文章中是个不太好处理的东西，绝大多数的作者会直接把英文字母和中文混写在一起，但是这样的显示效果并不好。具体对比效果如下图

在稍微重要的关键词的两边，我加了两个空格，稍稍加一点距离，对于英文单词，除了空格之外还对首字母进行大写，两条文字一对比效果很明显就可以看出来。

标注文章引用内容

有的文章可能会引用一些其他文章的资料、名人名言等，这样就需要选中这块文字，点击“块引用”，这样就可以告诉阅读者，这是一块来自他人的内容，我引用过来的。

用预格式化描述代码等有格式的内容

例如一段代码，通常有换行、空格之类的用来保持代码的结构，如果以普通的文字发布，可能会破坏这个结构，所以要用预格式化。

使用其他修饰的注意事项

其他的文字修饰还有很多，包括：斜体、删除线、下划线、颜色、字体大小等。这些文字修饰要慎用，用多了，会让阅读者感觉杂乱影响阅读心情。就颜色来说，一篇文章中最多不要超过两种颜色。

尽量多的使用图片

虽然不能极端的说没有图片的文章不是好文章，但是一篇好文章是肯定有图片的。文章中的图片主要有以下两个用处：

与文章内容相符增强文章表现力

缓和阅读中的视觉疲惫

所以，文章中，要尽量配图。配图也要跟文章主题相符合，例如：介绍人物的文章，配张人物图片；介绍软件的，配张软件截图；写心情生活类的，可以配张唯美的图片等等。

用心去写文章

一篇文章最吸引人的是文章的内容，再好的排版，没有好的内容，人们也不会去看的。所以要用心去写文章。

写之前有明确的目的（介绍自己的写作排版经验），有一个大体的构思（包括写哪几部分），然后觉得写出来会给阅读者一定的帮助，这时候就开始动手写。 写的过程中，按照之前的构思，列出大纲和知识点收集整理相关资料，然后针对每个知识点去截图或者用 PS 作图来更形象的描述这个问题。写完并且上传图片之后，还要反复检查两边，看看是否有废话、错别字以及没介绍清楚的地方。

就本文而言，本人用了两个小时的时间来写作，为写出一篇有价值的文章，付出这些是值得的。

一个反例

下图是从所谓刚子博客上截取的，是一篇被我缩小的文章，整体是一大段文字没有任何的段落层次、修饰、图片，是一个非常好的反例。

如果只是一篇短小的文字，这样是可以的，如果是一篇很长的文字，不免让阅读者疲惫。

写在最后

用 WordPress 写出一篇好看的文章，首先要用心去写，写出一篇高质量、有阅读价值的文章，其次要对文章不同的内容进行修饰。本文就介绍了一些写作经验。

至于文章内容具体的修饰样式，是根据你用的 WordPress 主题而定。本人的原创主题Qetro就对文字的排版进行了一定的优化，如果你的博客写文字比较多一点，不妨试用一下看看效果。

如何自己写wordpress主题

1、创建所需的文件

在进行主题定制前，应该首先创建一个可供自定义的“设置选项页面”。创建设置选项页的代码需要放置在主题目录下的functions.php文件中。如果我们的模板名为“OptionPage”，那么functions文件的路径为：wp-contentthemesOptionPagefunctions.php。

我们不需要让wordpress手动加载它，在执行时wordpress会自动加载。

2、建立设置选项页

首先第一步需要在后台建立一个空白页面供我们使用。我们通过add_aaction来实现这一步。Actions可以在wordpress执行时的特定时间被响应，例如，当在控制面板创建菜单时，admin_menu就会被响应执行。因此，可以利用这些来实现我们所需的功能。这是我们创建选项页的最基本的功能。

?php

// 设置选项页

function themeoptions_admin_menu()

{

// 在控制面板的侧边栏添加设置选项页链接

add_theme_page(“主题设置”, “主题选项”, ‘edit_themes’, basename(__FILE__), ‘themeoptions_page’);

}

function themeoptions_page()

{

// 设置选项页面的主要功能

}

add_action(‘admin_menu’, ‘themeoptions_admin_menu’);

?

themeoptions_admin_menu()是在控制面板的侧边栏中添加一个链接，指向我们创建的选项页：themeoptions_page。

add_theme_page() 的参数为：

页面标题：主题设置

菜单标题：主题选项（p.s.为了区分显示，页面与菜单标题我做了不同我命名）

作用功能：edit_themes；

Handle（句柄）：当前文件；

执行的函数：themeoptions_page；

如何进行wordpress的二次开发

WWordPress的二次开发分为两个主要方面:主题开发和插件开发。

1.主题开发首先，了解WordPress主题结构很重要。WordPress主题由一套PHP文件、CSS文件和图像文件组成。你可以通过编辑这些文件来自定义主题，使其适合你需要的风格和功能推荐使用wordPress官方提供的主题开发文档作为参考，其中包括了详细的步票和代码示例。

2.插件开发:插件是一系列的功能代码，用于向WordPress添加新功能或改进现有功能。在开发插件之前，你需要先确定你想要添加的功能以及实现方式推荐使用WordPress官方提供的插件开发文档作为参考，其中包括了详细的步票和代码示例司时也要学会使用WordPress提供的API来操作WordPress系统，例如:WP_Query (用于查询数据库) 、wp_enqueue script (用于加载JavaScript) 等。

总之，在进行WordPress二次开发时，建议始终保持代码结构清晰易读、注释规范、避免出现与其他插件、主题冲突的问题，以确保你的开发工作能够顺利进行并为用户带来良好的使用体验。

怎样制作wordpress手机主题

如下的操作步骤请参考：

一、安装MobilePress插件

在此之前，你需要有个wordpress博客平台，然后按照下图的（图示一）安装MobilePress插件。

MobilePress插件是一款自动识别访问设备的插件，它可以根据用户的设备来决定以什么样的主题来呈现内容，非常方便。

二、配置MobilePress Options选项

安装成功后，会在左侧菜单栏增加一个菜单荐，名字为“MobilePress”，点击展开，会有3个选项（图1）：

- Options：选项

- Themes ：主题

- Moblie Ads：广告代码

这一步，我们打开Options这个菜单，如（图2）所示，

- Blog Title：博客标题

- Blog Description：博客描述

- Mobile Themes Directory：手机博客主题目录

- Force Mobile Site：是否强制使用手机模式浏览

三、配置MobilePress Themes选项

MobilePress插件自身会提供两套现成的手机主题:

- default（默认）：`plugins/mobilepress/system/themes/default`

- iphone（iphone版）：`plugins/mobilepress/system/themes/iphone`

用户可以选择自已喜欢的模板做为展现用。

四、配置Moblie Ads选项

因为MobilePress系国外的插件，所以，广告联盟也是国外的，这个选项暂时无用，可跳过。

五、准备手机主题的2次开发

MobilePress自带的两个主题模板，样式简陋，兼容性也比较差，我们可以在它的基础上进行2次开发，以达到我们的个性化的需求。

开发流程：

- 复制 default默认主题模板，路径为`plugins/mobilepress/system/themes/default`;

- 按照自已的需求对defult主题代码进行2次开发即可。

default模板文件布如图所示：

这个模板提供了基础的输出功能和简单的样式，按照文件名可以为各个页面进行方便地2次开发。

如何用Bootstrap制作WordPress主题

在我们开始前还有一点事情需要你去做：

安装WordPress

下载并解压缩 Bootstrap

安装主题测试驱动插件*

* 如果你想在一个线上的网站上创建一个主题并且不想在你开发的过程中让人们看到新主题，你正好需这个插件。

一旦你准备好这些事情，打开你带有WordPress所有文件的目录并导航至wp-content themes。

在你导航至那个文件夹后，创建一个叫“wpbootstrap”的新文件夹，在文件夹里面粘贴bootstrap文件夹。

在那个文件夹里面创建一个新文件叫index.php。

现在我们将要把基本营销网站的源码拷贝并粘贴到index.php里面。下面是你所要用到的源码。我们仅链接了代码的一个文本版本，因为它太长了不能嵌入在这里。

bootstrap-demo-source-code

现在我们有了一个静态的html页面，我们将要继续去创建一个主css页面。WordPress需要一个显示在style.css页面顶部的特殊格式的注释，它使用这个注释来获得关于你这个主题的所有信息。

在你的index.php页面所在文件夹中创建一个新文件并命名为style.css，WordPress需要一个带有特定名称的CSS文件style.css，所以我们不将其命名为其它任何名称否则我们的主题将不能工作。

创建完了style.css文件，在文件头部添加注释：

/*

Theme Name: WP Bootstrap

Theme URI: http //teamtreehouse com/wordpress-bootstrap-theme-tutorial

Description: A demo theme built to accompany the Treehouse blog post a href="http //teamtreehouse com/wordpress-bootstrap-theme-tutorial"How to Build a WordPress Theme with Bootstrap/a.

Author: Zac Gordon

Author URI: http //teamtreehouse com/

Version: 1.0

Tags: responsive, white, bootstrap

License: Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)

License URI: http //creativecommons org/licenses/by-sa/3.0/

This simple theme was built using the example Bootstrap theme "Basic marketing site" found on the Bootstrap web site http //twitter github com/bootstrap/examples/hero html

*/

在我们安装和开始构建我们新主题前，我们最后需要做的是上传一张将会在WordPress管理区显示我们主题的图片。这张图片需要为300*225像素并且要命名为“screenshot.png”，你可以用下面这张图片或做张你自己的。

你的文件夹结构现在看起来和下面的一样：

我们现在准备进入到控制面板安装我们的新主题。登录到控制面板并且到外观主题。可应该可以看到“WP Bootstrap”做为主题中的一个被列出来。

点击WP Bootstrap主题下面的激活设置它为网站的当前主题。

注意: 如果你正在使用一个线上的网站并且不想让人们看到这个主题正在开发中，确保安装并激活 Theme Test Drive plugin。