首页 视频课程 主题开发课程第02章、开发实例 WordPress入门实例:文章列表页制件方法

WordPress入门实例:文章列表页制件方法

2023-06-11 / 645阅

WordPress入门实例:文章列表页制件方法

1. 创建文章列表页模板文件

在WordPress主题文件夹中,创建一个名为archive.php的文件,此文件可以用作文章列表页面模板。如果你需要创建一个特定类型的文章列表页面模板,你可以根据文章类型创建单独的模板文件,例如,如果你需要一个示例portfolio文章类型的模板,你可以创建一个名为archive-portfolio.php的文件。

2. 添加文章列表代码到模板文件

为了显示文章列表,我们需要在模板文件中添加一个循环代码。在WordPress中,The Loop是最常用于显示文章内容的PHP函数。我们可以使用循环代码遍历文章列表并输出文章内容。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

    <!-- 其他代码,例如链接至文章、文章标题、文章作者和摘要等 -->

<?php endwhile; endif; ?> 

这段代码的作用是检查是否存在文章,如果存在,就开始循环。在循环中,我们使用the_post()函数来设置当前文章的信息并输出文章内容。在循环结束时,我们使用endif来结束if语句。

3. 添加文章元数据和链接

除了文章内容之外,我们还可以输出一些文章元数据,例如文章标题、作者、日期和类别。为了查询文章的元数据,我们可以使用以下代码:

<?php the_title(); ?>
<?php the_author(); ?>
<?php the_date(); ?>
<?php the_category(); ?> 

此外,我们还可以添加一个链接,让用户能够访问该文章的完整内容。以下代码可以用于创建一个包含文章标题和链接的HTML标记:

<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> 

4. 添加文章摘要

为了使文章列表更加易于阅读,我们还可以为每篇文章添加一个摘要。摘要可以用于描述文章内容,并让用户了解更多关于文章的信息。以下代码可以用来输出文章摘要:

<?php the_excerpt(); ?> 

5. 添加文章特色图像

为了让文章列表更加多样化,我们还可以在文章列表中添加特色图像。特色图像是一个显示在文章列表中的图片,它可以帮助用户更好地了解文章内容。以下代码可以在文章列表中显示文章的特色图像:

<?php the_post_thumbnail(); ?> 

示例代码

以下是一个基本的文章列表页模板,其中包含了文章列表循环、元数据、链接、摘要和特色图像。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
  <div class="post">
    <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    <div class="post-meta">
      <span class="post-author"><?php the_author(); ?></span>
      <span class="post-date"><?php the_date(); ?></span>
      <span class="post-category"><?php the_category(); ?></span>
    </div>
    <?php if ( has_post_thumbnail() ) : ?>
      <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a>
    <?php endif; ?>
    <div class="post-excerpt">
      <?php the_excerpt(); ?>
    </div>
  </div>
<?php endwhile; endif; ?> 

以上就是制作WordPress文章列表页的一个基本流程。如果需要在主题中添加更多页面模板,请参考WordPress官方文档进行学习。

阅读文章或者观看视频过程中有任何问题,请下方留言或者联系我Q248758228

大家谈论
    我的见解
    目录