デイトラweb制作上級編パターン3 DAY31~44⑪

卒業制作課題パターン3 11日目
home.php

category.php

「投稿一覧ページ」のテンプレートファイル↓

(引用元:https://wpdocs.osdn.jp/ )
「カテゴリーページ」のテンプレートファイル↓

投稿一覧ページの作成(home.php)
固定ページ でタイトル → お知らせ、スラッグ → news の固定ページを作る

設定 > 表示設定 から投稿ページを作成した固定ページに変更

home.php↓
PHP(メイン)
<!-- メイン -->
<div class="p-home-main">
<?php
if (have_posts()) :
?>
<ul class="p-home-main__items">
<?php
while (have_posts()) :
the_post();
?>
<li class="p-home-main__item">
<a href="<?php the_permalink(); ?>">
<?php
$category = get_the_category();
if ($category[0]) {
echo '<span class="p-home-main__item-cat">' . $category[0]->cat_name . '</span>';
}
?>
<div class="p-home-main__item-image-wrapper">
<div class="p-home-main__item-image"><?php the_post_thumbnail('large'); ?></div>
</div>
<div class="p-home-main__item-body">
<p class="p-home-main__item-title"><?php the_title(); ?></p>
<time class="p-home-main__item-publish" datetime="<?php the_time('c'); ?>"><?php the_time('Y.n.j'); ?></time>
</div>
</a>
</li>
<?php endwhile; ?>
</ul>
<?php endif; ?>
<!-- ページネーション -->
<?php
$args = array(
'mid_size' => 4,
'prev_text' => ' ',
'next_text' => ' ',
'screen_reader_text' => ' ',
);
the_posts_pagination($args);
?>
</div>
PHP(サイドバー)
<!-- サイドバー -->
<aside class="p-home-sidebar">
<div class="p-home-sidebar__new">
<div class="p-home-sidebar__new-inner">
<div class="p-home-sidebar__new-title">最近の記事</div>
<ul class="p-home-sidebar__new-items">
<?php
$information = get_posts(array(
'posts_per_page' => 5,
'order' => 'DESK'
));
?>
<?php
foreach ($information as $post) :
setup_postdata($post);
?>
<li class="p-home-sidebar__new-item">
<a href="#">
<div class="p-home-sidebar__new-item-image-wrapper">
<div class="p-home-sidebar__new-item-image"><?php the_post_thumbnail('large'); ?></div>
</div>
<div class="p-home-sidebar__new-item-body">
<p class="p-home-sidebar__new-item-title">
<!-- 文字数制限 -->
<?php
$text = get_the_title();
$limit = 29;
if (mb_strlen($text) > $limit) {
$title = mb_substr($text, 0, $limit);
echo $title . '...';
} else {
echo $text;
}
?>
</p>
<time class="p-home-sidebar__new-item-publish" datetime="<?php the_time('c'); ?>"><?php the_time('Y.n.j'); ?></time>
</div>
</a>
</li>
<?php
endforeach;
wp_reset_postdata();
?>
</ul>
</div>
</div>
<div class="p-home-sidebar__category">
<div class="p-home-sidebar__category-inner">
<div class="p-home-sidebar__category-title">カテゴリ</div>
<ul class="p-home-sidebar__category-items">
<?php
$categories = get_categories();
foreach ($categories as $category) {
echo '<li class="p-home-sidebar__category-item"><a href="' . get_category_link($category->term_id) . '">' . $category->name . '</a></li>';
}
?>
</ul>
</div>
</div>
</aside>
カテゴリーページの作成(category.php)
PHP
<!-- アーカイブタイトル -->
<div class="p-home-main__head"><?php the_archive_title(); ?></div>
<!-- メインとサイドバーは同じ -->
PHP(functions.php)
/**
* アーカイブタイトル書き換え
*/
function my_archive_title($title)
{
if (is_category()) { // カテゴリーアーカイブの場合
$title = single_cat_title('', false);
}
return $title;
};
add_filter('get_the_archive_title', 'my_archive_title');
まとめ
今回も卒業制作課題を進めました。
この辺りは他の卒業制作課題でも作成したことがあるのでスムーズに作れました。
たまにテンプレートファイルの問題でカスタム投稿とごちゃごちゃになりますが。。。