如何制作一款属于自己的WordPress主题
的有关信息介绍如下:既然您已经搜索到了这篇文章,首先说明您对WordPress有一定的了解。我想说的是,制作一款属于自己的WordPress主题并不困难。 本文将引导您制作出一款您专有的最基本的WordPress主题,当然,你在制作主题时,可以拿一些免费的主题作为参考,这里推荐您参考WordPress默认自带的Twenty Twelve。 虽然我们在这里只是提供一个最基本的主题制作方法,但学习都是渐进的,通过制作这样一款主题,您会发现他并不难,同时您也会发现我们学到了很多东西且有很多东西我们不曾了解,需要更多的探索。 您会发现依据网络,一切皆有可能。 通过查CSS您可能获得更多的CSS控制的特效的技能或许您会发现BootStrap是如此强大。通过查找get_header,您会发现更多其独特的功能,你会发现wp_footer函数像WP_head()函数一样重要,通过查找侧边栏sidebar,您会发现原来可能通过小工具使侧边栏变得如此强大,通过查找文章类型,文章形式,分类法,你会发现原来WordPress可以完成你想要的任何功能。
使用XAMPP搭建本地环境,启动后的画面是这样的,关于使用方法,请善用百度
2.规划主题文件目录
这是完整的主题目录里应该包含的文件,包含了一些有用的扩展
方框里的内容是我们本文所必须的。
3.分离主题文件代码
根据我们前面设计的页面外观我们的主页的HTML代码可以是这样的:
HEADER
接下来,我们对这些代码进行模块分离,区分出header,footer,sidebar,index等内容。头部文件Header.php: Header.php文件中的第4行我们更换了样式表的文件路径,这样主题就会自己判断并加载侧边栏文件sidebar.php Siderbar.php文件中分别输出了分类的列表和归档的列表。底部文件footer.php
主题样式文件:style.css HEADER
/*Theme Name: Book ReviewTheme URI: http://www.aidd.me/themeAuthor: the WordPress teamAuthor URI: http://www.ibooks.org.cn/*/body { text-align: center; }#wrapper { display: block; border: 1px #a2a2a2 solid; width:90%; margin:0px auto; }#header { border: 2px #a2a2a2 solid; }#content { width: 75%; border: 2px #a2a2a2 solid; float: left; }#sidebar { width: 23%; border: 2px #a2a2a2 solid; float: right; }#delimiter { clear: both; }#footer { border: 2px #a2a2a2 solid; }.title { font-size: 11pt; font-family: verdana; font-weight: bold; }
主题样式文件主要完成对主题外观的控制,这些只是最基本的样式控制文件,你可以根据自己的需要进行适合的修改以达到自己想要的效果。通过对最简单的HTML的不同控制,您会发现在以后的主题制作中如何优化代码,提高代码的通用性。主文件index.php:
在主文件中,我们分别通过调用了get_header(),get_sidebar(),get_footer()实现了文件的整合,通过if判断是否存在日志文章,然后通过While循环来输出数据库中的日志文档。这虽然是一个最基本,最简单的主题,但通过主题的制作您能够会不断的发现问题,并通过请教百度,谷歌等搜索引擎来获取更多的知识。通过查CSS您可能获得更多的CSS控制的特效的技能或许您会发现BootStrap是如此强大。通过查找get_header,您会发现更多其独特的功能,你会发现wp_footer函数像WP_head()函数一样重要,通过查找侧边栏sidebar,您会发现原来可能通过小工具使侧边栏变得如此强大,通过查找文章类型,文章形式,分类法,你会发现原来WordPress可以完成你想要的任何功能。Main Area
Posted on