• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > wordpress CMS主题制作 > 制作wordpress主题教程(8):index.php首页文件

    制作wordpress主题教程(8):index.php首页文件

    作者: 分类:wordpress CMS主题制作 点击: 3,244 次
    wordpress CMS主题:ssmay主题

      通过前面几章的制作,我们已经为wanlimm主题添加了header.php、sidebar.php、fooder.php文件,这几个都是一个网面中的几个部件,将它们拼起来就是一个完整的网页。今天,我们就将网页首页index.php制作起来。也许你要问了,我们前面不是已创建了index.php文件了吗?是的,我们是创建了,但是,它还是一个空白的文件,没有任何内容,也就是说我们的网站首页还是空白的,本章我们是要为它添加内容代码。

      首先,通过dreamweaver打开index.php文件,然后在其中添加如下代码:

      <?php get_header(); ?><!-- 加载头部文件 header.php文件-->

      <!-- 首页文章列表开始 -->

      -----------首页文章列表----------

      <!-- 首页文章列表结束 -->

      <?php get_sidebar(); ?><!-- 加载侧边栏 sidebar.php 文件 -->

      <?php get_footer(); ?><!-- 加载底部  footer.php 文件-->

      通过上面的代码,我们就通过前面我们创建的几个文件将首页找成,完成首页基本布局。

      接下来,我们为首页添加首页文件列表代码,将上面的“   -----------首页文章列表---------- ”替换成下面的代码:

      <div class="content"> <!-- #content -->
      <?php if(have_posts()) : while(have_posts()) : the_post(); ?>

      <div class="post" id="post-<?php the_ID(); ?>">
      <h2><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h2><!-- 文章标题 -->

      <div class="info">
      <span class="categories"><?php the_category(','); ?></span><!-- 文章分类 -->
      <span class="tags"><?php the_tags('', ', ', ''); ?></span><!-- 文章标签 -->
      <span class="times"><?php the_time('Y年n月j日') ?> </span> <!-- 时间 -->
      </div>

      <div class="intro">
      <?php echo dm_strimwidth(strip_tags($post->post_content),0,60,"..."); //文章摘要 ?>
      </div>
      </div>

      <?php endwhile;else : ?>
      <div class="errorbox">
      目前没有文章。
      </div>
      <?php endif; ?>

      </div><!-- #content -->

      通过上面的代码就会在首页输出网站的文件列表。上面的代码中的文章摘要部分我们用到了dm_strimwidth()函数,这是一个截取字段函数,上面的那句代码意思是截取文章的60个字的摘要。这个函数要我们创建,我们在主题的functions.php文件中添加这个函数,代码如下:

      //截字
      function dm_strimwidth($str ,$start , $width ,$trimmarker ){$output = preg_replace('/^(?:[\x00-\x7F]|[\xC0-\xFF][\x80-\xBF]+){0,'.$start.'}((?:[\x00-\x7F]|[\xC0-\xFF][\x80-\xBF]+){0,'.$width.'}).*/s','\1',$str); return $output.$trimmarker;};

      当然,我们也可以用the_content()函数和the_excerpt()函数,但the_content()是输出文章全文,而the_excerpt()函数主要是针对英文的,而且是要在发表文章时添加摘要。这个根据自己的需要来使用吧。

      好了,主题首页就制作好了。打开网站首页看一下它的效果吧,如下图:

      制作wordpress主题教程(8):index.php首页文件

      因为还没有设置CSS样式,所以,现在的布局还是乱的,这人等我们设置好了CSS就会好的。这个放到模板完后我们再进行。



      QQ二维码

    文章作者:高时银博客
    本文地址:http://wanlimm.com/77201505244075.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.