2013年09月11日 追記・変更

loop.phpの呼び出しをファイルではなく直接記述する

今現在、page.phpのファイルの中身はindex.phpと同じ内容。
ここから変更をしていくのだが、変更箇所は、メイン部分のみとなる。

現在の記述 page.php

<!-- ヘッダー読み込み header.phpを読み込んでくれる -->
<?php get_header(); ?>

   <div id="contents">

	<!-- メイン部分の読み込み loop.phpを読み込んでくれる -->
	<?php get_template_part( 'loop' ); ?>

	<!-- サイドバー読み込み sidebar.phpを読み込んでくれる -->
	<?php get_sidebar(); ?>


   </div><!-- /#contents -->

<!-- フッター読み込み footer.phpを読み込んでくれる -->
<?php get_footer(); ?>

loop.phpの呼び出しを止めて直接記述する

page.phpの下記部分を削除して、loop.phpのファイルの内容を全てコピー貼り付ける。
<!-- メイン部分の読み込み loop.phpを読み込んでくれる -->
	<?php get_template_part( 'loop' ); ?>

loop.phpの部分を直接記述したソース page.php

灰色でハイライトを行っている部分が固定ページにおいて不要な箇所だ。
<!-- ヘッダー読み込み header.phpを読み込んでくれる -->
<?php get_header(); ?>

   <div id="contents">





	<!-- main -->
      <div id="main">


	<!-- ▼表示する記事がある場合、ループ開始▼ -->

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

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

	<?php the_content('続きを読む &rarr;'); ?>

	<br clear="all" />
	</p>


	<div class="meta">

	投稿日: <?php the_date(); ?><br />

	カテゴリー: <?php the_category('|'); ?> <?php the_tags('タグ: ',' '); ?> | 投稿者: <?php the_author_posts_link(); ?>
	</div>

<?php endwhile; else: ?>
	<p>
	記事がない場合に表示させる文章など。

	<br clear="all" />
	</p>



<?php
endif;
?>
	<!-- ▲表示する記事がある場合、ループ開始▲ -->



	<!-- ▼もし記事が表示数より多い場合、ページャーを表示する▼ -->

<?php if ( $wp_query -> max_num_pages > 1 ) : ?>
<div style="width:100%">

	<div style="float:left">
	<?php previous_posts_link('&laquo;前ページ'); ?>
	</div>

	<div style="float:right">
	<?php next_posts_link('次ページ&raquo;'); ?>
	</div>
</div>
<?php endif; ?>
	<!-- ▲もし記事が表示数より多い場合、ページャーを表示する▲ -->


      </div>
	<!-- /main -->





	<!-- サイドバー読み込み sidebar.phpを読み込んでくれる -->
	<?php get_sidebar(); ?>


   </div><!-- /#contents -->

<!-- フッター読み込み footer.phpを読み込んでくれる -->
<?php get_footer(); ?>

不要な箇所を削除する

前回の説明ページで、固定ページの用件定義を行った。
その際、投稿日、カテゴリーやタグ、投稿者、ページャーといった記述は不要だった。

不要な箇所を消した記述 page.php

<!-- ヘッダー読み込み header.phpを読み込んでくれる -->
<?php get_header(); ?>

   <div id="contents">






	<!-- main -->
      <div id="main">


	<!-- ▼表示する記事がある場合、ループ開始▼ -->
<?php
if(have_posts()) :
while(have_posts()) :
the_post(); ?>

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

	<?php the_content('続きを読む &rarr;'); ?>

	<br clear="all" />
	</p>



<?php endwhile; else: ?>
	<p>
	記事がない場合に表示させる文章など。

	<br clear="all" />
	</p>



<?php
endif;
?>
	<!-- ▲表示する記事がある場合、ループ開始▲ -->




      </div>
	<!-- /main -->




	<!-- サイドバー読み込み sidebar.phpを読み込んでくれる -->
	<?php get_sidebar(); ?>


   </div><!-- /#contents -->

<!-- フッター読み込み footer.phpを読み込んでくれる -->
<?php get_footer(); ?>

【ソース解説】不要な箇所を消した記述 page.php

<!-- ヘッダー読み込み header.phpを読み込んでくれる -->
<?php get_header(); ?>

   <div id="contents">






	<!-- main -->
      <div id="main">


	<!-- ▼表示する記事がある場合、ループ開始▼ -->
<!--
■if( have_posts() ) 
該当ページで表示する記事があるかどうかを判断している。
記事があった場合、if内の処理を実行する。
■have_post()
ワードプレスの条件分岐テンプレタグ。条件式に使用する。
もし記事がある場合、trueを返す。
■while( have_posts() ) 
該当ページで表示する記事があるかどうかを判断している。
phpのループ構文while文。条件式がtrueの間、処理を繰り返す。
■the_post();
現在の記事番号の取得と、カウンターの増減をするテンプレタグ。
while文のループ内で記述する$i++;のような変数の増減と同じ。
ループ内の処理の一番最初に記述する点に注意。
これがないと現在の記事番号が変化しないため、ループから抜け出せれない。
-->
<?php
if(have_posts()) :
while(have_posts()) :
the_post(); ?>

<!--
■the_permalink();
該当記事のURLを出力してくれるテンプレタグ
■the_title();
該当記事のタイトルを出力してくれるテンプレタグ
-->
	<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
	<p>

<!--
■the_content();
該当記事の本文を出力してくれるテンプレタグ
()内の引数は、記事入力内でmoreを使用した際に表示させる文。
なので、moreを使わなかった場合、表示されない。
-->
	<?php the_content('続きを読む &rarr;'); ?>

	<br clear="all" />
	</p>



<?php endwhile; else: ?>
	<p>
	記事がない場合に表示させる文章など。

	<br clear="all" />
	</p>



<?php
endif;
?>
	<!-- ▲表示する記事がある場合、ループ開始▲ -->




      </div>
	<!-- /main -->




	<!-- サイドバー読み込み sidebar.phpを読み込んでくれる -->
	<?php get_sidebar(); ?>


   </div><!-- /#contents -->

<!-- フッター読み込み footer.phpを読み込んでくれる -->
<?php get_footer(); ?>

ページの表示を確認する

orijinal12_01
元々のHTMLと同じ表示になった。固定ページはこれで製作完了。残るはsingle.phpのみだ。

この記事が気に入ったら下のボタンをクリック

  • このエントリーをはてなブックマークに追加
  • Clip to Evernote
  • LINEで送る


Leave a Reply