wordpress程序的header.php顶部文件制作

header.php是载入公共头部代码的一个文件,在wordpress主题中随处可见,因为涉及到各方各面的知识以及SEO效果,其重要性不言而喻。
下面是教材中的全部代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DT ... gt%3B <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Nature's Charm by Free CSS Templates</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <link href="default.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <!-- start header --> <div id="header"> <div id="logo"> <h1><a href="#">nature's charm </a></h1> <h2><a href="http://www.freecsstemplates.org/">By Free CSS Templates</a></h2> </div> <div id="menu"> <ul> <li class="active"><a href="#" accesskey="1" title="">Home</a></li> <li><a href="#" accesskey="2" title="">Blog</a></li> <li><a href="#" accesskey="3" title="">Photos</a></li> <li><a href="#" accesskey="4" title="">About</a></li> <li><a href="#" accesskey="5" title="">Contact</a></li> </ul> </div> </div> <!-- header.php文件截断 --> <div id="gallery"> <div id="top-photo"> <p><a href="#"><img src="images/img08.jpg" alt="" width="830" height="300" /></a></p> </div> </div> <!-- start page --> <div id="page"> <!-- start content --> <div id="content"> <div class="post"> <h1 class="title">Welcome to My Website</h1> <p class="byline"><small>Posted on August 25th, 2007 by <a href="#">admin</a> | <a href="#">Edit</a></small></p> <div class="entry"> <p><strong>Nature's Charm</strong> is a free template from <a href="http://freecsstemplates.org/">Free CSS Templates</a> released under a <a href="http://creativecommons.org/lic ... ative Commons Attribution 2.5 License</a>. The flower photo is fromt <a href="http://www.pdphoto.org/%26quot ... t%3B. You're free to use this template for both commercial or personal use. I only ask that you link back to <a href="http://freecsstemplates.org/">my site</a> in some way. Enjoy :)</p> </div> <p class="meta"><a href="#" class="more">Read More</a>     <a href="#" class="comments">Comments (33)</a></p> </div> <div class="post"> <h2 class="title">Risus Pellentesque Pharetra</h2> <p class="byline"><small>Posted on August 25th, 2007 by <a href="#">admin</a> | <a href="#">Edit</a></small></p> <div class="entry"> <blockquote> <p>&#8220;Praesent augue mauris, accumsan eget, ornare quis, consequat malesuada, leo.&#8221;</p> </blockquote> <p>Maecenas pede nisl, elementum eu, ornare ac, malesuada at, erat. Proin gravida orci porttitor enim accumsan lacinia. Donec condimentum, urna non molestie semper, ligula enim ornare nibh, quis laoreet eros quam eget ante.</p> </div> <p class="meta"><a href="#" class="more">Read More</a>     <a href="#" class="comments">Comments (33)</a></p> </div> </div> <!-- index.php内容区 --> <!-- sidebar.php侧边栏区 --> <div id="sidebar"> <ul> <li> <h2>Categories</h2> <ul> <li><a href="#">Aliquam libero</a></li> <li><a href="#">Consectetuer adipiscing elit</a></li> <li><a href="#">metus aliquam pellentesque</a></li> <li><a href="#">Suspendisse iaculis mauris</a></li> <li><a href="#">Urnanet non molestie semper</a></li> <li><a href="#">Proin gravida orci porttitor</a></li> </ul> </li> <li> <h2>Archives</h2> <ul> <li><a href="#">September</a> (23)</li> <li><a href="#">August</a> (31)</li> <li><a href="#">July</a> (31)</li> <li><a href="#">June</a> (30)</li> <li><a href="#">May</a> (31)</li> <li><a href="#">April</a> (30)</li> <li><a href="#">March</a> (31)</li> <li><a href="#">February</a> (28)</li> <li><a href="#">January</a> (31)</li> </ul> </li> </ul> </div> <!-- sidebar.php结束 --> </div> <div style="clear: both; height: 30px"> </div> <!-- end page --> <div id="footer"> <p>&copy;2007 All Rights Reserved.  &bull;  Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a></p> </div> </body> </html>


找到下面这段说明:

<!-- header.php文件截断 -->


在主题根部新建文件,改名为header.php,然后把上门的说明标签以上的内容全部复制到header.php里面。然后再分别新建个index.php,footer.php,sidebar.php,style.css。再找到其中两个标签!

<!-- header.php文件截断 -->

<!-- index.php内容区 -->


把标签内的代码全部复制进index.php里面,然后再查找

<!-- sidebar.php侧边栏区 -->

<!-- sidebar.php结束 -->


重复上面的步骤,把中间的代码复制到新建的sidebar.php文件。最后一步把:

</div> <div style="clear: both; height: 30px"> </div> <!-- end page --> <div id="footer"> <p>&copy;2007 All Rights Reserved.  &bull;  Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a></p> </div> </body> </html>


这段代码复制进新建的footer.php里面,把default.css改名为style.css。你点击外观→主题,是不是多了一个名称为1的主题?点击启用,回到首页是不是乱七八糟的,乱七八糟就对了,因为该主题纯粹是显示了index.php的html代码。很多东西都没关联起来

0 个评论

要回复文章请先登录注册