ワードプレスオリジナルテーマ作り方⑤　トップぺージに投稿記事表示 | 福岡のホームページ制作はマリオ君にお任せ

<?PHP get_template_part("parts/header");//ここでheader.phpよみこんでるよ?>

	<?PHP get_template_part("parts/head");//ここでhead.phpよみこんでるよ?>
	<article>
		<section class="blogbox">
			<p class="topi">
			現在自社ホームぺージ制作進行中です。<br>
				もうすこしちゃんとしたホームぺージ作れますので、<br>
ご依頼はお問い合わせフォームよりご連絡ください。<br>
お仕事ください。サイトから依頼きたらボーナスでるんや。
			</p>
			<h2>ブログ</h2>
			<ul>
				<li>
					<a href="kiji.html">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
				<li>
					<a href="記事のページに">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
				<li>
					<a href="記事のページに">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
				<li>
					<a href="記事のページに">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
				<li>
					<a href="記事のページに">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
				<li>
					<a href="記事のページに">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
			</ul>
			<p class="btn"><a href="<?PHP echo esc_url( home_url() ); ?>/blog/">ブログの記事一覧はこちら→→</a></p>
		</section>
		<!--blogbox終わり-->
	</article>
	<!--article終わり-->
<?PHP get_template_part("parts/foot");//ここでfoot.phpよみこんでるよ?>

<?PHP get_template_part("parts/header");//ここでheader.phpよみこんでるよ?>
	
	<?PHP get_template_part("parts/head");//ここでhead.phpよみこんでるよ?>
	<article>
		<section class="blogbox">
			<p class="topi">
			現在自社ホームぺージ制作進行中です。<br>
				もうすこしちゃんとしたホームぺージ作れますので、<br>
ご依頼はお問い合わせフォームよりご連絡ください。<br>
お仕事ください。サイトから依頼きたらボーナスでるんや。
			</p>
			<h2>ブログ</h2>
			<ul>
				<li>
					<a href="記事の内容にリンク">
						<h3>ブログ記事のタイトル</h3>
						<p class="day">投稿日時</p>
						<div class="bassui">ブログ記事を抜粋した文章を表示</div>
						<ul>
							<li>カテゴリー</li>
						</ul>
						<p class="more">詳しく見る→</p>
					</a>
				</li>
			</ul>
			<p class="btn"><a href="<?PHP echo esc_url( home_url() ); ?>/blog/">ブログの記事一覧はこちら→→</a></p>
		</section>
		<!--blogbox終わり-->
	</article>
	<!--article終わり-->
<?PHP get_template_part("parts/foot");//ここでfoot.phpよみこんでるよ?>

<!--ループスタート文章-->	
<?php
$paged = get_query_var('paged')? get_query_var('paged') : 1;
$args = array(
    'post_type' => 'post',//どの記事を出力するかpostは投稿　カスタムポストの場合は好きな名前　例）news　とか
    'posts_per_page' => 6,//記事を何個出力するの数字で出力する記事を指定する　　-1の場合は全部
    'paged' => $paged,//ようわからん
    );
$the_query = new WP_Query($args);
if ( $the_query->have_posts() ) :
while ( $the_query->have_posts() ) : $the_query->the_post();
?>
<!--ループスタート文章-->
				
スタートと終わりの間のここにループして出力したいhtmlタグとワードプレスタグを入れておく				

				
<!--ループ終わり文章-->				
<?PHP endwhile;endif;?>
<?php wp_reset_postdata(); ?>
<!--ループ終わり文章-->	

<li>
    <a href="記事の内容にリンク">
        <h3>ブログ記事のタイトル</h3>
        <p class="day">投稿日時</p>
        <div class="bassui">ブログ記事を抜粋した文章を表示</div>
        <ul>
            <li>カテゴリー</li>
        </ul>
        <p class="more">詳しく見る→</p>
    </a>
</li>

<li>
    <a href="<?PHP the_permalink();//個別ページへのURLを出力?>">
        <h3><?PHP the_title();//記事のタイトルを出力?></h3>
        <p class="day"><?PHP echo get_the_date();//投稿日を出力?></p>
        <div class="bassui">
			<?PHP the_excerpt();//抜粋を表示?>
		</div>
        <ul>
			<!--カテゴリーをリンクなしで出力-->
			<?php
			foreach((get_the_category()) as $cat){
			echo '<li>' . $cat->cat_name . '</li>'. ' ';
			}
			?>
			<!--カテゴリーをリンクなしで出力-->
        </ul>
        <p class="more">詳しく見る→</p>
    </a>
</li>

<?PHP the_permalink();//個別ページへのURLを出力?>

<?PHP echo get_the_date();//投稿日を出力?>

<?PHP the_excerpt();//抜粋を表示?>

<!--カテゴリーをリンクなしで出力-->
			<?php
			foreach((get_the_category()) as $cat){
			echo '<li>' . $cat->cat_name . '</li>'. ' ';
			}
			?>
<!--カテゴリーをリンクなしで出力-->

<?php the_category();//対象カテゴリーulでリンク付きで表示 ?>

<?PHP get_template_part("parts/header");//ここでheader.phpよみこんでるよ?>
	
	<?PHP get_template_part("parts/head");//ここでhead.phpよみこんでるよ?>
	<article>
		<section class="blogbox">
			<p class="topi">
			現在自社ホームぺージ制作進行中です。<br>
				もうすこしちゃんとしたホームぺージ作れますので、<br>
ご依頼はお問い合わせフォームよりご連絡ください。<br>
お仕事ください。サイトから依頼きたらボーナスでるんや。
			</p>
			<h2>ブログ</h2>
			<ul>
				
<!--ループスタート文章-->	
<?php
$paged = get_query_var('paged')? get_query_var('paged') : 1;
$args = array(
    'post_type' => 'post',//どの記事を出力するかpostは投稿　カスタムポストの場合は好きな名前　例）news　とか
    'posts_per_page' => 6,//記事を何個出力するの数字で出力する記事を指定する　　-1の場合は全部
    'paged' => $paged,//ようわからん
    );
$the_query = new WP_Query($args);
if ( $the_query->have_posts() ) :
while ( $the_query->have_posts() ) : $the_query->the_post();
?>
<!--ループスタート文章-->
				
<li>
    <a href="<?PHP the_permalink();//個別ページへのURLを出力?>">
        <h3><?PHP the_title();//記事のタイトルを出力?></h3>
        <p class="day"><?PHP echo get_the_date();//投稿日を出力?></p>
        <div class="bassui">
			<?PHP the_excerpt();//抜粋を表示?>
		</div>
        <ul>
			<!--カテゴリーをリンクなしで出力-->
			<?php
			foreach((get_the_category()) as $cat){
			echo '<li>' . $cat->cat_name . '</li>'. ' ';
			}
			?>
			<!--カテゴリーをリンクなしで出力-->
        </ul>
        <p class="more">詳しく見る→</p>
    </a>
</li>
				
<!--ループ終わり文章-->				
<?PHP endwhile;endif;?>
<?php wp_reset_postdata(); ?>
<!--ループ終わり文章-->	
				
			</ul>
			<p class="btn"><a href="<?PHP echo esc_url( home_url() ); ?>/blog/">ブログの記事一覧はこちら→→</a></p>
		</section>
		<!--blogbox終わり-->
	</article>
	<!--article終わり-->
<?PHP get_template_part("parts/foot");//ここでfoot.phpよみこんでるよ?>