9.front-page.phpを作成
index.phpをコピーして、front-page.phpを作成する。
サイトのトップページに、サムネイル画像を表示し、
アイキャッチ画像を設定していなければ、用意してあるnoimg.pngを表示。
その下にタイトルを表示させています。
8行目 表示する件数は3つ
9行目 表示するカテゴリーは「youtube」
19行目 サムネイルがあれば表示
20行目 サムネイルはfuncitons.phpに指定されている「list-thumbnail」のサイズが指定される。クラスは「img-fluid」（このクラスはbootstrap4の画像をレスポンシブにするためのクラス）
22行目 サムネイルが無ければ、nono.pngが表示される。
26行目 リンク付きタイトル
<?php get_header(); ?>
<main>
<div class="container">
<div class="row">
<?php
$arg = array(
'posts_per_page' => 3, // 表示する件数
'category_name' => 'youtube' // 表示したいカテゴリーのスラッグを指定
);
$posts = get_posts( $arg );
if( $posts ): ?>
<?php
foreach ( $posts as $post ) :
setup_postdata( $post ); ?>
<div class="col-12">
<div>
<a href="<?php the_permalink(); ?>">
<?php if ( has_post_thumbnail() ): ?>
<?php the_post_thumbnail( 'list-thumbnail', array( 'class' => 'img-fluid') ); ?>
<?php else: ?>
<img src="<?php echo $img_url; ?>/nono.png" class="img-fluid">
<?php endif; ?>
</a>
</div>
<p><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></p>
</div>
<?php endforeach; ?>
<?php
endif;
wp_reset_postdata();
?>
</div>
</div>
</main>
<?php get_footer(); ?>
wp-content/
├─themes/
├─yourfolder/
├─css
└─common.css
├─js
└─main.js
├─index.php
├─front-page.php
├─header.php
├─footer.php
├─style.css
└─functions.php