wordpress CMS主题 微信
  • 全部教程
  • Home > wordpress CMS主题制作 > 制作wordpress主题教程(8):index.php首页文件

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

    高时银博客 wordpress CMS主题制作 点击: 1,447 次 0 0

    通过前面几章的制作,我们已经为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就会好的。这个放到模板完后我们再进行。


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

    目前还没有评论。赶快来坐沙发吧。

    发表评论