【适合初学者】制作自己的WordPress主题［archive.php］［category.php］［taxonomy.php］

在这里，我们将介绍创建WP主题时必不可少的archive.php代码，并进行解释。
标题中包括category.php，但目前可以认为它们是相同的。
基本思路与其他页面不太不同，但由于是archive.php，所以有一些需要注意的事项，请阅读至最后。

暂时不需要解释，只需看下面的代码。

代碼（HTML和PHP）

<?php /*
==========================================
Theme Name: Archive + Category
==========================================
*/
get_header(); ?>
<div class="wrap">
<main id="archive">
<div class="breadcrumb-area">
    <?php output_breadcrumb(); ?>
</div><!--//class="breadcrumb-area"-->
<?php
//先頭辞を非表示
add_filter( 'get_the_archive_title_prefix', function($prefix) {
    $prefix = ''; //空文字代入
    return $prefix;
});
$archtitle = get_the_archive_title();
echo '<h1 class="en-txt under-line">' .$archtitle. '</h1>';
?>
<?php
	if(have_posts()) :
?>
    <div class="archive-frame">
<?php
		while (have_posts()) : the_post();
?>
    <section class="archive-box">
	<a href="<?php the_permalink(); ?>">
		<?php
		if(has_post_thumbnail()){
			echo '<figure class="thumb-img4">' .get_the_post_thumbnail(). '</figure>';
		} else {
			echo '<figure class="thumb-img4"><img src="' .get_template_directory_uri(). '/images/noimages.png"></figure>';
		}
		?>
		<h4><?php the_title(); ?><span class="moddate en-txt"><?php the_modified_date('Y/m/d') ?></span></h4>
        <?php
        //本文を文字数制限表示
        if(mb_strlen($post->post_content,'UTF-8')>50){
            $content= str_replace('\n', '', mb_substr(strip_tags($post-> post_content), 0, 50,'UTF-8'));
            echo '<div class="txt-box">' .$content.'……'. '</div>';
        }else{
            echo '<div class="txt-box">' .str_replace('\n', '', strip_tags($post->post_content)). '</div>';
        }
         ?>
	</a>
	</section><!--//class="archive-box"-->
<?php
		endwhile;
?>
    </div><!--//class="archive-frame"-->
    <?php
    //ページネーション
    the_posts_pagination(array(
        'prev_text' => 'PREV',
        'next_text' => 'NEXT'
    ));
    ?>
<?php
	endif;
?>
</main>
<?php get_sidebar(); ?>
    </div><!--// class="wrap"-->
<?php
get_footer(); ?>

最初，「档案馆」（Archive）是什么？

当搜索“存档”一词时，可以获得“把数据集中保存起来”的意思。在WP中，当提到“存档”时，是指“文章列表”的意思。

例如，在企业网站上经常会将最新信息以列表形式显示，或者在需要列出特定类别时称之为“存档”。

解释

archive.php是什么？

這是制作自定義 WP 主題時的必備文件。
根據不同分類的 category.php、不同分類法的 taxonomy.php、不同用戶的 author.php、不同日期的 date.php，以及不同標籤的 date.php，如果存在存檔顯示，則 archive.php 就不是必需的。
這意味著上述文件都可以在 archive.php 中兼容使用。
必備模板已經在官方 Codex 中列出，請確認。

別記事でも書いていますが、私はテーマファイルは最小構成にしたいと考えており、デザインがシンプルであるなら、兼用できるものは兼用してしまおう、数行の条件分岐で済むなら1ファイルにまとめてしまおうと考えています。
ですので、タイトルにはarchive.php category.php taxonomy.phpと3種類のテンプレート名を入れています。この3つは上述したことを踏まえた上で、archive.phpに集約することができます。

请参考我之前写的一篇文章，其中介绍了简单且最小的文件结构。

然而，并不是“集约”总是好的，所以请根据情况将文件分开使用。
特别是自定义投稿类型归档和自定义分类法归档，初次见面可能会让人感到困惑。
WordPress的好处是，只要准备好想要显示的专用模板，只要不犯代码错误或错误命名文件，就可以轻松地显示出来。我认为重要的是理解在哪些条件下显示哪个模板，并加以利用。

必须的代码 de

读取页眉：get_header(); 读取页脚：get_footer(); 循环的 是必须的。别忘了用 结束循环。

如果您已经浏览过这些适用于初学者的WordPress主题的［singular.php］［single.php］［page.php］，我认为您已经注意到了首先列出的代码循环位置的不同之处。下面将详细解释包括这一点在内的代码。

代码的解释

下記の部分は、プラグインなしの自作「パンくずリスト」を独自の関数で読み込んでいます。

<div class="breadcrumb-area">
    <?php output_breadcrumb(); ?>
</div><!--//class="breadcrumb-area"-->

プラグインだと、更新されないとセキュリティホールになったり、余計な機能が付いていてサーバの容量を圧迫したり、自分の思った挙動にならなかったりと面倒なことが起きがちですが、自分で書いたシンプルなコードであれば、テーマファイルを読み込んだタイミングで有効化され、カスタマイズも簡単にできます。

コードはこちらで記事にしていますので参考にどうぞ。

在开始循环之前

WPのテンプレートと言えば「とにかく何を置いてもloopを書く」だと思うのですが、アーカイブのタイトルは記事名ではなく、カテゴリ名やタクソノミー名なので、それらを取得し表示します。

<?php
//先頭辞を非表示
add_filter( 'get_the_archive_title_prefix', function($prefix) {
    $prefix = ''; //空文字代入
    return $prefix;
});
$archtitle = get_the_archive_title();
echo '<h1 class="en-txt under-line">' .$archtitle. '</h1>';
?>

本来アーカイブで表示するタイトルはthe_archive_title();という関数で表示しますが、この関数で表示すると名称の先頭に「 カテゴリー：」や「 タグ： 」と言う文言が自動で付与されます。
閲覧する方々には、カテゴリーとタグを区別する必要性はないかなという事で私はadd_filterを使って表示しないようにしています。

add_filter( 'get_the_archive_title_prefix', function($prefix) {
    $prefix = ''; //空文字代入
    return $prefix;
});

只需要一个选项：隐藏前缀。

$archtitle = get_the_archive_title();
echo '<h1 class="en-txt under-line">' .$archtitle. '</h1>';

将通过add_filter将隐藏前缀的标题存入变量$archtitle，并通过echo显示。
因为这是存档页面的标题，所以我们将其用h1标签包围起来。
在这里我们将其存储在一个变量中，但也可以选择不存储在变量中。

echo '<h1 class="en-txt under-line">' .get_the_archive_title(). '</h1>';

即使不带前缀，也会显示。

Codexにもある様に、 get_the_archive_title();は、タクソノミーやタームのアーカイブでもタイトルを取得できるので、もしテンプレートをtaxonomy.phpとして分ける場合でもそのまま使えます。

循环的开始

要说循环的起源，

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

不过，在archive.php中，我会稍微变换一下写法。

<?php
	if(have_posts()) :
?>
    <div class="archive-frame">
<?php
		while (have_posts()) : the_post();
?>

<?php
if(have_posts()) :
    while(have_posts()) : the_post();
?>
    <div class="archive-frame">

とwhile (have_posts()) : the_post();の下にdivを書いてしまう事です。
そうすると、

    <section class="archive-box">
        ......
	</section><!--//class="archive-box"-->

    <section class="archive-box">
	<a href="<?php the_permalink(); ?>">
		<?php
		if(has_post_thumbnail()){
			echo '<figure class="thumb-img4">' .get_the_post_thumbnail(). '</figure>';
		} else {
			echo '<figure class="thumb-img4"><img src="' .get_template_directory_uri(). '/images/noimages.png"></figure>';
		}
		?>
		<h4><?php the_title(); ?><span class="moddate en-txt"><?php the_modified_date('Y/m/d'); ?></span></h4>
        <?php
        //本文を文字数制限表示
        if(mb_strlen($post->post_content,'UTF-8')>50){
            $content = str_replace('\n', '', mb_substr(strip_tags($post-> post_content), 0, 50,'UTF-8'));
            echo '<div class="txt-box">' .$content.'……'. '</div>';
        }else{
            echo '<div class="txt-box">' .str_replace('\n', '', strip_tags($post->post_content)). '</div>';
        }
         ?>
	</a>
	</section><!--//class="archive-box"-->

if(mb_strlen($post->post_content,'UTF-8')>50){

<?php
		endwhile;
?>
    </div><!--//class="archive-frame"-->
    <?php
    //ページネーション
    the_posts_pagination(array(
        'prev_text' => 'PREV',
        'next_text' => 'NEXT'
    ));
    ?>
<?php
	endif;
?>

'prev_text' => 'PREV',
'next_text' => 'NEXT'

<nav class="navigation pagination" area-label="投稿">
<h2 class="screen-reader-text">投稿ナビゲーション</h2>
    <div class="nav-links">
        <span area-current="page" class="page-numbers current">1</span>
        <a class="page-numbers" href="******">2</a>
        <a class="next page-numbers" href="*****">NEXT</a>
    </div>
</nav>