読者です 読者をやめる 読者になる 読者になる

ハロトレWebデザインの勉強 | 求職者支援訓練Webサイト制作科 フェリカテクニカルアカデミー

未経験者からプロになるハロートレーニングWebデザインの勉強

記事の投稿日とカテゴリーを表示する

日付の設定

記事の投稿日を表示する

  • 記事タイトルの下に表示させる
<h1><?php the_title(); ?></h1>

<?php echo get_the_date(); ?>
記事の投稿日をマークアップする
<time datetime="<?php echo get_the_date( 'Y-m-d' ); ?>">
<?php echo get_the_date(); ?>
</time>

記事が属するカテゴリーを表示する

<time datetime="<?php echo get_the_date( 'Y-m-d' ); ?>">
<?php echo get_the_date(); ?>
</time>

<?php the_category(); ?>
カテゴリー名を横に並べて表示する
  • リスト表示をインラインで表示する
<span class="postcat">
<?php the_category( '' ); ?>
</span>
付加情報としてマークアップする
<div class="postinfo">
<time datetime="<?php echo get_the_date( 'Y-m-d' ); ?>">
<?php echo get_the_date(); ?>
</time>

<span class="postcat">
<?php the_category( '' ); ?>
</span>
</div><!-- /.postinfo -->
CSSの記述
/* 記事の付加情報 */
.postinfo {
  margin-top: 15px;
  font-size: 14px;
}
.postinfo a {
  color: #333;
  text-decoration: none;
}
.postinfo .postcat {
  margin-left: 20px;
}