日付の表示形式を “西暦/月/日” にしたのと、アイキャッチ画像を利用できるようにしたのでメモ。 アイキャッチ画像を使うことはあまりないかもしれないけど、たまに使いたいことがあったので設定してみた。

差分

index.php

index.phpは記事の一覧を表示する。 日付の表示形式の変更は “the_time(’M j, Y’)” を “the_time(‘Y/m/d’)” に変更しただけ。 後半のdivタグがアイキャッチ画像の表示。アイキャッチ画像については末尾の参考ページ参照。

.../wp-content/themes% diff -U 3 diary/index.php diary_eyecatch/index.php
--- diary/index.php     2012-04-26 23:40:29.999721337 +0900
+++ diary_eyecatch/index.php    2012-05-08 00:39:12.347890339 +0900
@@ -26,9 +26,14 @@
                                <!-- Begin Article -->
                                <article class="post">
                                        <header class="postHeader">
-                                         <div class="date"><?php the_time('M j, Y') ?> - <span><img src="<?php bloginfo('template_directory'); ?>/images/ico_file.png" alt=""> <?php the_category(', ') ?>   <img src="<?php bloginfo('template_directory'); ?>/images/ico_comment.png" alt=""> <?php comments_popup_link('No Comments', '1 Comment ', '% Comments'); ?></span> </div>
+                                         <div class="date"><?php the_time('Y/m/d') ?> - <span><img src="<?php bloginfo('template_directory'); ?>/images/ico_file.png" alt=""> <?php the_category(', ') ?>   <img src="<?php bloginfo('template_directory'); ?>/images/ico_comment.png" alt=""> <?php comments_popup_link('No Comments', '1 Comment ', '% Comments'); ?></span> </div>
                                          <h2><a href="<?php the_permalink() ?>" ><?php the_title(); ?></a></h2>
                                        </header>
+<div class="thumbnail"><!-- CSSでデザイン用クラスの追加 -->
+       <a href="<?php the_permalink(); ?>"><!-- 投稿のリンクを取得 -->
+       <?php the_post_thumbnail( 'single-post-thumbnail', array('title' => ''.get_the_title().'') ); ?><!-- サムネイルの画像タイトルを投稿タイトルへ変更 -->
+       </a>
+</div>
                                        <section class="postText">
                                         <?php the_content('Read more »'); ?>
                                        </section>
@@ -48,4 +53,3 @@
 <?php get_sidebar();?>
 <?php get_footer();?>
 
-

single.php

single.phpは記事を表示する。 index.php同様、日付の表示形式の変更を “the_time(’M j, Y’)” を “the_time(‘Y/m/d’)” に変更しただけ。 アイキャッチ画像についてあも、index.php同様、後半のdivタグが該当箇所。

.../wp-content/themes% diff -U 3 diary/single.php diary_eyecatch/single.php
--- diary/single.php    2012-04-26 23:40:29.998721597 +0900
+++ diary_eyecatch/single.php   2012-05-06 19:12:23.955057962 +0900
@@ -6,9 +6,14 @@
                                <!-- Begin Article -->
                                <article class="post">
                                        <header class="postHeader">
-                                         <div class="date"><?php the_time('M j, Y') ?> - <span><img src="<?php bloginfo('template_directory'); ?>/images/ico_file.png" alt=""> <?php the_category(', ') ?>   <img src="<?php bloginfo('template_directory'); ?>/images/ico_comment.png" alt=""> <?php comments_popup_link('No Comments', '1 Comment ', '% Comments'); ?></span> </div>
+                                       <div class="date"><?php the_time('Y/m/d') ?> - <span><img src="<?php bloginfo('template_directory'); ?>/images/ico_file.png" alt=""> <?php the_category(', ') ?>   <img src="<?php bloginfo('template_directory'); ?>/images/ico_comment.png" alt=""> <?php comments_popup_link('No Comments', '1 Comment ', '% Comments'); ?></span> </div>
                                          <h2><a href="<?php the_permalink() ?>" ><?php the_title(); ?></a></h2>
                                        </header>
+<div class="thumbnail"><!-- CSSでデザイン用クラスの追加 -->
+       <a href="<?php the_permalink(); ?>"><!-- 投稿のリンクを取得 -->
+       <?php the_post_thumbnail( 'single-post-thumbnail', array('title' => ''.get_the_title().'') ); ?><!-- サムネイルの画像タイトルを投稿タイトルへ変更 -->
+       </a>
+</div>
                                        <section class="postText">
                                         <?php the_content(); ?>
                                        </section>

functions.php

functions.phpではアイキャッチ画像を有効にする設定を記述する。
…/wp-content/themes% diff -U 3 diary/functions.php diary_eyecatch/functions.php
— diary/functions.php 2012-04-26 23:40:30.002722578 +0900
+++ diary_eyecatch/functions.php        2012-05-06 19:02:44.990890509 +0900
@@ -940,4 +940,7 @@
   return array_shift($hexstr);
 }

+// eyecatch +add_theme_support( ‘post-thumbnails’ ); +add_image_size( ‘single-post-thumbnail’, 200, 160, true ); ?>

参考ページ

■ WordPressでアイキャッチ画像をサムネイルとして一覧ページに表示する方法 | Oxy notes http://oxynotes.com/?p=1829